ant-design-vue/components/vc-input-number/demo/simple.jsx

44 lines
952 B
Vue
Raw Normal View History

2019-01-12 03:33:27 +00:00
import InputNumber from '../src/index';
import '../assets/index.less';
2018-04-04 04:04:49 +00:00
export default {
2019-01-12 03:33:27 +00:00
data() {
2018-04-04 04:04:49 +00:00
return {
disabled: false,
readOnly: false,
value: 5,
2019-01-12 03:33:27 +00:00
};
2018-04-04 04:04:49 +00:00
},
methods: {
2019-01-12 03:33:27 +00:00
onChange(value) {
console.log('onChange:', value);
this.value = value;
2018-04-04 04:04:49 +00:00
},
2019-01-12 03:33:27 +00:00
toggleDisabled() {
this.disabled = !this.disabled;
2018-04-04 04:04:49 +00:00
},
2019-01-12 03:33:27 +00:00
toggleReadOnly() {
this.readOnly = !this.readOnly;
2018-04-04 04:04:49 +00:00
},
},
2019-01-12 03:33:27 +00:00
render() {
2018-04-04 04:04:49 +00:00
return (
2019-01-12 03:33:27 +00:00
<div style="margin: 10px;">
2018-04-04 04:04:49 +00:00
<InputNumber
min={-8}
max={10}
value={this.value}
onChange={this.onChange}
2019-01-12 03:33:27 +00:00
style="width: 100px"
2018-04-04 04:04:49 +00:00
readOnly={this.readOnly}
disabled={this.disabled}
/>
2019-01-12 03:33:27 +00:00
<p style="padding:10px 0">
2018-04-04 04:04:49 +00:00
<button onClick={this.toggleDisabled}>toggle Disabled</button>
<button onClick={this.toggleReadOnly}>toggle readOnly</button>
</p>
</div>
2019-01-12 03:33:27 +00:00
);
2018-04-04 04:04:49 +00:00
},
2019-01-12 03:33:27 +00:00
};