码迷,mamicode.com
首页 > 其他好文 > 详细

vue中的number

时间:2017-08-04 12:54:01      阅读:401      评论:0      收藏:0      [点我收藏+]

标签:ext   类型   this   eof   function   rip   com   mod   text   

今天在vue文档中看到有number这样一个修饰符

技术分享

觉得挺方便的就尝试了一下下面是代码

<body>
<div id="box">
<input type="number"  v-model.number="message" id="test" @change="change()">
    <div>{{message}}</div>
</div>
</body>
<script type="text/javascript">
    var test=document.getElementById("test")
    new Vue({
        el:"#box",
        data:{
            message:"123",
        },
        methods:{
            change:function () {
                console.log(typeof test.value)
            }
        }
    })


</script>

结果打出出来并不是我想的numer而是string,随即在网上查找了了一下看到很多人有类似的问题,最后我发现这个修饰修改的是并不是input里面的类型,而是和他绑定的data里面的message,接下来再尝试一下

<div id="box">
<input type="number"  v-model.number="message" id="test" @change="change()">
    <div>{{message}}</div>
</div>
</body>
<script type="text/javascript">
    var test=document.getElementById("test")
    new Vue({
        el:"#box",
        data:{
            message:"123",
        },
        methods:{
            change:function () {
                console.log(typeof this.message)
            }
        }
    })
</script>

果然最后输出的是number

 

vue中的number

标签:ext   类型   this   eof   function   rip   com   mod   text   

原文地址:http://www.cnblogs.com/yuanzhiguo/p/7284277.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!