vue基本语法01赋值、表达式、指令、修饰符、简写、过滤、监听

一、vue赋值的三种方式

1、{ {属性名}}

{
    {data}}

2、v-html:能输出源码信息

3、v-text：只能输出文本信息

二、表达式

vue支持所有的js的方法各种表达式
字符：

{
    {str.substr(0,3).toUpperCase()}}

数字

{
    { number + 1 }}不能进行自动类型转换

三元运算符

{
    { ok ? 'YES' : 'NO' }}

字符串拼接

我的Id是js动态生成的

注：其中的变量在vue中声明了的

三、指令

指令是指带有“v-”前缀的特殊属性
核心指令：(v-if|v-else|v-else-if)/v-show/v-for/v-bind/v-on/v-model
v-if

我是if

v-else:上一个指令必须是v-if或者v-else if

我是v-else

v-else-if:上一个指令必须是v-if

我是else if

注意：在这些指令中只能识别变量，如果写一个变量和一个字符串比较，会自动识别字符串为变量
v-show：当里面的结果为false时，这个控件不会被显示

asdasdsa1

v-for：类似JS的遍历，遍历数组:

 

			 	{
    {i}}
			 

首先在vue实例中声明fore数组，即可，i为具体的对象

fore:['zs','ls','ww','yy','xx']

遍历对象
首先声明v对象数组，其中v属性值，k属性名，i下标，要注意对象是先写中括号

scores:[
					{
						cours:'语文',
						score:'78'
					},
					{
						cours:'数学',
						score:'88'
					},
					{
						cours:'英语',
						score:'99'
					},
					
				]

				 

					{
    {k}} :{
    {v}}
				 
			 

v-bind:用来绑定控件的属性什么的
v-on:用来绑定各种事件
v-model:也是用来绑定属性等各种值；有一个特点就是，能自动更新对应的值

四、修饰符

有很多中修饰符，在这里只是说明有修饰符这种，可以上官网上查找对应的文档，每个修饰符都有它的特殊的作用

       
      
      
      

      
      
      
      

      
      
...
      
      
...
      
      

还有按键修饰符,还可以查找对应的数字调用即可

  
      

      Vue为最常用的按键提供了别名
      
      

    <--  全部的按键别名：
      .enter
      .tab
      .delete (捕获 "删除" 和 "退格" 键)
      .esc
      .space
      .up
      .down
      .left
      .right
      .ctrl
      .alt
      .shift
      .meta      -->

五、监听

watch:{
				a:function(){
					 this.b=this.a*1000;
				},
				b:function(){
					this.a=this.b/1000;
				}
			}