el-input-number入门学习
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<link rel="stylesheet" href="/element-ui/lib/theme-chalk/">
<script src="/npm/vue/dist/"></script>
<script src="/element-ui/lib/"></script>
</head>
<body>
<div id='app'>
<!-- el-input-number -->
<el-input-number v-model='number' @change='handleChange' :min='1' :max='10'></el-input-number>
<!-- disabled -->
<el-input-number v-model='number' @change='handleChange' :min='1' :max='10' disabled></el-input-number>
<!-- step -->
<el-input-number v-model='stepNumber' :step='2'></el-input-number>
<!-- step + step-strictly -->
<el-input-number v-model='stepNumber' :step='2' step-strictly></el-input-number>
<!-- precision必须是一个非负整数，并且不能小于step的小数位数 -->
<el-input-number v-model='floatNumber' :precision='2' :step='0.02'></el-input-number>
<!-- size -->
<el-input-number v-model='floatNumber' :precision='2' :step='0.1' size='mini'></el-input-number>
<!-- controls-position -->
<el-input-number v-model='number' controls-position='right' :min='1' :max='10'></el-input-number>
</div>
</body>
</html>
<script>
let vm = new Vue({
el: '#app',
data: {
number: 1,
stepNumber:0,
floatNumber: 1,
},
methods: {
handleChange(number) {
console.log(number)
}
}
})
</script>
<style></style>