设为首页收藏本站
切换到窄版

鱼C论坛

 找回密码
 立即注册
鱼C论坛»论坛 › 技术交流 › Web开发 › 怎么用vue做输入表单后可以打印出来输入的值
返回列表 发新帖
查看: 3443|回复: 7

[已解决]怎么用vue做输入表单后可以打印出来输入的值

[复制链接]
我爱Cyinyinyin
发表于 2020-10-26 17:29:45 | 显示全部楼层 |阅读模式

马上注册，结交更多好友，享用更多功能^_^

您需要 登录 才可以下载或查看，没有账号？立即注册

x
用vue编程来做一个表单，可以将输入的数据打印出来 这怎么做啊？
最佳答案
月排行榜 / 总排行榜
kogawananari
2020-10-26 17:35:53
在官方文档里翻watch选项 用来监听data的变化
  1.   watch:{
  2.     'msg': function(newdata, olddata){
  3.       console.log(olddata)//打印原来的值
  4.       console.log(newdata)//打印现在的值
  5.       if(!olddata){
  6.         setTimeout(()=>{
  7.           //如果你要向父组件发射数据this.$emit()
  8.         },1000)
  9.       }
  10.     },
  11.   }
复制代码
想知道小甲鱼最近在做啥？请访问 -> ilovefishc.com
回复

使用道具 举报

kogawananari
发表于 2020-10-26 17:35:53 | 显示全部楼层    本楼为最佳答案   
在官方文档里翻watch选项 用来监听data的变化
  1.   watch:{
  2.     'msg': function(newdata, olddata){
  3.       console.log(olddata)//打印原来的值
  4.       console.log(newdata)//打印现在的值
  5.       if(!olddata){
  6.         setTimeout(()=>{
  7.           //如果你要向父组件发射数据this.$emit()
  8.         },1000)
  9.       }
  10.     },
  11.   }
复制代码
想知道小甲鱼最近在做啥？请访问 -> ilovefishc.com
回复 支持 反对

使用道具 举报

kogawananari
发表于 2020-10-26 17:50:08 | 显示全部楼层
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <script src="https://cdn.bootcss.com/vue/2.6.10/vue.js"></script>
  5. </head>
  6. <body>
  7. <div id="app">
  8.     <input type="text" v-model="msg">
  9. </div>
  10. <script>
  11. const vm = new Vue({
  12.     el: '#app',
  13.     data() {
  14.         return {
  15.             msg:''
  16.         }
  17.     },
  18.     watch:{
  19.         'msg': function(newdata, olddata){
  20.             console.log(olddata,newdata)//打印原来的值/现在的值
  21.         }
  22.     },
  23. })
  24. </script>
  25. </body>
复制代码

怕你不明白直接给你写全了
想知道小甲鱼最近在做啥？请访问 -> ilovefishc.com
回复 支持 反对

使用道具 举报

kogawananari
发表于 2020-10-26 17:52:18 | 显示全部楼层
不一定要watch这个功能，也可以用绑定事件的方法 可以是onchange 或者是失去焦点 都差不多
想知道小甲鱼最近在做啥？请访问 -> ilovefishc.com
回复 支持 反对

使用道具 举报

我爱Cyinyinyin
 楼主| 发表于 2020-11-15 22:14:58 | 显示全部楼层
kogawananari 发表于 2020-10-26 17:50
怕你不明白直接给你写全了

谢谢！
想知道小甲鱼最近在做啥？请访问 -> ilovefishc.com
回复 支持 反对

使用道具 举报

我爱Cyinyinyin
 楼主| 发表于 2020-11-15 22:20:07 | 显示全部楼层
kogawananari 发表于 2020-10-26 17:35
在官方文档里翻watch选项 用来监听data的变化

大佬 能给我说一下怎么用的吗？我不知道怎么调试
想知道小甲鱼最近在做啥？请访问 -> ilovefishc.com
回复 支持 反对

使用道具 举报

我爱Cyinyinyin
 楼主| 发表于 2020-11-15 22:21:59 | 显示全部楼层
kogawananari 发表于 2020-10-26 17:50
怕你不明白直接给你写全了

我运行完就给我显示404 这是什么情况啊
想知道小甲鱼最近在做啥？请访问 -> ilovefishc.com
回复 支持 反对

使用道具 举报

Dear黑色
发表于 2020-11-21 13:38:17 | 显示全部楼层
Console.log(变量);  控制台输出变量
想知道小甲鱼最近在做啥？请访问 -> ilovefishc.com
回复 支持 反对

使用道具 举报

返回列表 发新帖
高级模式
B Color Image Link Quote Code Smilies
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

小黑屋|手机版|Archiver|鱼C工作室 ( 粤ICP备18085999号-1 | 粤公网安备 44051102000585号)

GMT+8, 2024-4-20 18:18

Powered by Discuz! X3.4

© 2001-2023 Discuz! Team.

快速回复 返回顶部 返回列表