vue--指令中值得随笔的地方

    

  1. v-model-- 双向数据绑定
    1. number修饰指令
  2. <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>number</title>
    </head>
    <body id="app">
    <input type="text" v-model="num" number >
    {{num}}
    </body>
    <script src="../../bower_components/vue/dist/vue.js"></script>
    <script>
        var vm=new Vue({
            el:'#app',
            data:{
                num:23
            }
        });
    //修饰符 number部分源码
    /*
    export function toNumbet(value){
           if (typeof value !== "string"){
           return value
           }else {
           var parsed = Number(value)
           return isNaN(parse)? value : parsed
    
    }
      */
    
    </script>
    </html>

    2.debounce--不同于filter中的debounce,它们的实现原理相似(settimeout),作用不同,该指令用于延迟用户输入数据同步到model中的时间,并不能延迟用户输入事件的延迟所以想要获取变化后的数据,用$watch()监听;而事件的延迟filter中的debounce

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>debounce</title>
    </head>
    <body id="app">
    <input type="text" v-model="refresh" debounce="1000">
    <p>{{refresh}}</p>
    </body>
    <script src="../../bower_components/vue/dist/vue.js"></script>
    <script>
        var vm=new Vue({
            el:'#app',
            data:{
                refresh:''
            }
        })
    </script>
    </html>
Solve problems in the most elegant way
原文地址:https://www.cnblogs.com/yanghmartin/p/director.html