vue中input标签的使用
vue中input标签的使用普通input标签<input type="text" value="" placeholder="placeholder" name="name" @input="print($event.target.value)">type: 规定input元素的类型;text: 标识文本输入框submit: 标识提交按钮checkbox多选框radio是单选框val
·
vue中input标签的使用
普通input标签
<input type="text" value="" placeholder="placeholder" name="name" @input="print($event.target.value)">
- type: 规定input元素的类型;
text: 标识文本输入框
submit: 标识提交按钮
checkbox 多选框
radio 是单选框 - value: 规定input框中的值
palceholder: 帮助用户填写输入字段的提示文本 - name: 用于对提交到服务器后的表单数据进行标识;
在客户端通过javascript引用表单数据;
<body>
<div id="app">
<input
type="text"
value=""
placeholder="placeholder"
name="name"
@input="print($event.target.value)"
/>
</div>
<script src="https://cdn.jsdelivr.net/npm/vue@2/dist/vue.js"></script>
<script>
var app = new Vue({
el: "#app",
data: {},
methods: {
print(e) {
console.log(e);
},
},
});
</script>
</body>
- 多了@input事件,监听输入框中数值的变化
- $event.target.value可以获得输入框中的值;
更多推荐
已为社区贡献6条内容
所有评论(0)