@alicd/crui-checkbox-field
Version:
复选框, FormItem + Checkbox【 @alicd/next 】 的功能融合,同时支持了 x-bind 双向绑定, rules 规则配置,name 表单 name 属性
54 lines (49 loc) • 1.1 kB
Markdown
---
order: 2
title: 受控
description: 使用 CheckboxGroupField 渲染的组,通过设置 value 属性可以让组件变成受限组件。
---
````jsx
import CheckboxField from '@alicd/crui-checkbox-field';
import { Form } from '@alicd/next';
class App extends React.Component {
state = {
checked: true
};
render() {
return (
<Form>
<CheckboxField
label="受控的 checkbox"
checked={this.state.checked}
onChange={
(checked) => {
this.setState({checked: checked});
}
}
/>
</Form>
);
}
}
ReactDOM.render(<App />, mountNode);
````
```` template
<Form>
<CheckboxField
label="受控的 checkbox"
checked={this.state.checked}
onChange={this.onChange}
/>
</Form>
````
```` javascript
walle.view.extend({
state: {
checked: true
},
onChange: function(checked) {
this.setState({checked: checked});
}
})
````