Vue详细介绍模板语法和过滤器的使用!
表达式
{{ XXX }}
使用过滤器
{{ XXX | yyy}}
使用多个过滤器
{{ XXX | yyy | yyy1}}
过滤器带参数
{{ XXX | yyy(123,"zhuiszhu") }}
动态属性:
<img v-bind:src="xxx" />
或 <img :src="xxx" />
绑定事件
<a v-on:click="xxx" />
或 <a v-on:click="xxx($event)" />
或 <a v-on:click="xxx($event,123)" />
或 <a v-on:click="xxx(123)" />
或 <a @click="xxx" />
指令:
v-if: 元素是否存在
v-else-if:
v-else 用法同js 的 if else if 及 else
注意 在使用了这几个指令的标签之间 不能存在其他元素
v-show: 元素是否显示
v-for: 循环迭代
<li v-for="item in list"></li>
或者
<li v-for="item in {name:'zhuiszhu',age:18}">
{{item}} ===> item值为 : zhuiszhu , 18
</li>
或者
<li v-for="item in 10"></li>
此时 item 值为: 1,2,3,4,5,6,7,8,9,10
获取索引
<li v-for="(item,i) in list"></li>
v-model: 数据双向绑定
全局过滤器
Vue.filter("name",function(value,sta1?,sta2?....){
return newValue
})
局部过滤器
let abc = function(value,sta1?,......){
return newValue
}
{
data: ...,
....,
fileters : {
name : abc
}
}
Vue详细介绍模板语法和过滤器的使用!的更多相关文章
- django “如何”系列4:如何编写自定义模板标签和过滤器
django的模板系统自带了一系列的内建标签和过滤器,一般情况下可以满足你的要求,如果觉得需更精准的模板标签或者过滤器,你可以自己编写模板标签和过滤器,然后使用{% load %}标签使用他们. 代码 ...
- 模板继承and自定义模板标签和过滤器
自定义模板标签和 过滤器: 因为模板标签和过滤器只给我们提供了 这么多 无法对我们的使用造成更多的便利 ,剩下的就需要我们自己去创建新的 模板标签和过滤器了 1.在settings中的INSTALLE ...
- Vue实例与模板语法
VUE基础使用方法 一.安装 1.NPM 在用 Vue 构建大型应用时推荐使用 NPM 安装[1].NPM 能很好地和诸如 webpack 或 Browserify 模块打包器配合使用.同时 Vue ...
- python3之Django内置模板标签和过滤器
一.模板标签 内置标签: 1.autoescape 控制当前的自动转义行为,此标记采用on或者off作为参数,并确定自动转义是否在块内有效.该块以endautoescape结束标签关闭. views: ...
- Django自定义模板标签和过滤器
1.创建模板库 在某个APP所在目录下新建包templatetags,然后在其中创建存储标签或者过滤器的的模块,名称随意,例如myfilters.py. 在这个模块中编写相关代码. 注意:templa ...
- 前端框架VUE——数据绑定及模板语法
一.数据绑定 Vue.js 的核心是一个允许采用简洁的模板语法来声明式地将数据渲染进 DOM 的系统: <div id="app"> {{ msg }} </di ...
- Django 自定义模板标签和过滤器
1.创建一个模板库 使用模板过滤器的时候,直接把过滤器写在app里,例如:在app里新建一个templatetags的文件夹,这个目录应当和 models.py . views.py 等处于同一层次. ...
- Django框架详细介绍---模板系统
Django模板系统 官方文档: https://docs.djangoproject.com/en/2.0/ref/templates/builtins/#std:templatetag-for 1 ...
- Django 内置模板标签和过滤器
一.内置模板标签 语法:{% %} autoescape : 是否转义,on或off作为参数,并确定自动转义是否在块内有效.该块以endautoescape结束 {% autoescape on % ...
随机推荐
- 使用jmeter进行压力测试及如何添加负载机
Jmeter是一款简单灵活且强大的性能测试工具,同时也可以做接口测试. 由于初识jmeter,今天来记录一下如何对一个web进行一个简单的压力测试. 1.首先在测试计划里面添加一个线程组,然后再其下面 ...
- c# 第二节 c#的常用IDE环境
本节内容: 1:常用ide环境 2:Visual Studio 简介 3:Visual Studio Express简介 4:Sharp Develop 5: IDE 与 .Net的版本 1:常用i ...
- 【软件工程1916|W(福州大学)_助教博客】2019年上学期期末问卷调查结果公示
1.调查问卷概况 福州大学2019W班,收集到有效答卷44份 2. 调查问卷情况 Q1:请问你平均每周在课程上花费多少小时? 去除自估水平超过40小时的,平均16.6H Q2.软工实践的各次作业分别花 ...
- mac os下切换pip3国内源并安装requests库
在使用Python的时候,经常会用到pip来安装模块,但是默认的下载源实在是特别慢,经常install的时候还会因为速度的原因直接报错,因此我们可以选择将下载源更改为国内的,这样就可以提高我们的下载速 ...
- windows下载的java项目部署到linux的各种解决方案
1.Java是跨平台的,在linux下有问题,主要一是文件读取权限:二检查下系统环境变量设置可正确!.profile JavaWeb_将Windows平台上开发的JavaWeb项目部署到Linux平台 ...
- vue系列--- 认识Flow(一)
1. 什么是Flow? Flow 是javascript代码的静态类型检查工具.它是Facebook的开源项目(https://github.com/facebook/flow),Vue.js(v2. ...
- Dubbo服务集群容错
Dubbo是Alibaba开源的分布式服务框架,我们可以非常容易地通过Dubbo来构建分布式服务,并根据自己实际业务应用场景来选择合适的集群容错模式,这个对于很多应用都是迫切希望的,只需要通过简单的配 ...
- 重拾算法之复杂度分析(大O表示法)
.katex { display: block; text-align: center; white-space: nowrap; } .katex-display > .katex > ...
- 使用jQuery的replaceWith()方法要注意的地方
<!doctype html> <html> <head> <meta charset="utf-8"> <title> ...
- set去重应用
1.其中涉及__hash__与__eq__这两个内置方法. 2.列如: 要求用类生成多个对象,其中姓名和性别相同的对象可认为是同一个人,用set原理做去重 class People: def __in ...