Vue.js 笔记（二） 模板语法

版权声明：本文为博主原创文章，未经博主允许不得转载。【合作联系QQ1668681286】 https://blog.csdn.net/qq_33036361/article/details/82351588

指令

1. 以 v-  开头 常见有：v-bind(数据单向输出),v-html(显示html),v-model(数据双向绑定),v-if(条件，是否插入元素)，v-on(事件)

2. 参数，指令后加冒号，如：v-bind:class='class1'  将DOM 元素class 属性与表达式 class1 的值绑定 

缩写

1. v-bind:---------:      如：v-bind:href='url' ---------:href='url'

2.v-on:----------@      如：v-on:click='sayhi'-------@click='sayhi'  

事件修饰符

例：   v-on:click.stop='dosth'      (阻止事件冒泡)  ,   v-on:keyup.enter (按回车键松开时)  

过滤器

常用：

名称	说明
uppercase	全部转为大写
lowercase	全部转为小写
currency	数字转为货币格式，第一个参数为货币符，第二个参数为保留小数位数
debounce	延迟执行，单位毫秒，限在@中使用
limitBy	限在v-for中使用，第一个参数 读取数量，第二个参数 开始位置
orderBy	限制:需在v-for(即数组)里面使用 ,第一个参数 搜索字符，第二个参数 升(>=0)降序(<0)
filterBy	限制:需在v-for(即数组)里面使用  格式： v-for="item in arr | filterBy 'l' in 'name' 'dada' "

自定义过滤器：

let v=new Vue({
    el:'el1',
    methods:{},
    filters:{
        filter1:function(val1,val2){ //第一个参数为调用者本身，后面可加多个其他参数
            //.....
            return '';
        }
    }
});