手抄报 安全手抄报 手抄报内容 手抄报图片 英语手抄报 清明节手抄报 节约用水手抄报

vue使用element-ui输入框input的值改变怎么获取

时间:2024-10-12 09:24:34

1、第一步,我们使用vue-cli脚手架工具创建一个vue项目,然后引入element-ui框架(不会的详情参考下面经验),详细目录文件如下图

vue使用element-ui输入框input的值改变怎么获取

2、第二步,我们前往element-ui官网,找到输入框input组件,看看有什么方法可以获取input的值,change事件可以实现这个功能,详细如下图

vue使用element-ui输入框input的值改变怎么获取

3、第三步,我们先把element-ui输入框组件放到我们项目中,代码以及效果如下图

vue使用element-ui输入框input的值改变怎么获取
vue使用element-ui输入框input的值改变怎么获取

4、第四步,我们在输入框组件中绑定一个change事件(用法@change=""),然后监听绑定v-model的值就可以了,详细代码如下图

vue使用element-ui输入框input的值改变怎么获取

5、第五步,利用命令行工具,运npm run dev,然后利用配置的地址打开网页,在输入框输入不同的内容都能监听到,详细代码如下图

vue使用element-ui输入框input的值改变怎么获取
© 手抄报圈