我正在尝试使用RangeControl 组成部分这就是我正在做的：
el(
RangeControl,
{
label: \'Columns\',
value: props.attributes.my_attribute,
initialPosition: 1,
min: 0,
max: 3,
onChange: function( val ) {
}
}
),
这工作正常，但如果我在
value 参数（并通过
onChange 事件），则组件停止工作（实际上
onChange 事件，但组件无法正确渲染（移动当前值指示器）。
var my_variable = 1;
el(
RangeControl,
{
label: \'Columns\',
value: my_variable,
initialPosition: 1,
min: 0,
max: 3,
onChange: function( val ) {
my_variable = val;
}
}
),
这里有我遗漏的东西吗？这是预期的行为，还是我在组件中意外发现了一个bug？
非常感谢。
最合适的回答,由SO网友:Alvaro 整理而成
使用修改块属性的控件时，需要将控件的值设置为属性的值，onChange函数需要使用setAttributes函数更改属性：
el(
RangeControl,
{
label: \'Columns\',
value: props.attributes.my_attribute,
initialPosition: 1,
min: 0,
max: 3,
onChange: function( val ) {
props.setAttributes({ my_attribute: val })
}
}
),
上面的示例链接到一个块。块属性修改零部件状态。如果您想自己修改状态，可以将其链接到redux存储。或者您可以通过
withState HOC. 为此，您需要将组件包装在
withState 并使用it提供的道具进行更新。
const { withState } = wp.compose;
const { Component } = wp.element;
const { RangeControl } = wp.components;
class Range extends Component {
render() {
const { my_number, setState } = this.props;
return (
<RangeControl
value={my_number}
min={0}
max={3}
onChange={value => {
setState({ my_number: value });
}}
/>
);
}
}
export default withState({ my_number: 1 })(Range);
