Vue框架学习

    
‘box1‘>
    //{{}}会被vue解析为数据的渲染的指定语法
        {{}}
    
    

    
class=‘box2‘>
        {{}}
    

    
‘app‘>
        {{msg}}
    

    
‘app‘>
        
{{info}}
        // v-text 为vue的文本指令 = ‘info‘, info为vue实例data中的一个变量
        
‘info‘>
        
‘msg‘>
        
‘res‘>
    

    
‘app‘>
        // v-bind: 属性 = ‘变量‘
        // 如果abc自定义属性被v-bind:指令绑定了,后面的值也会变成vue变量,如果就想是普通字符串,再用‘‘包裹
        // : 就是v-bind: 的简写方式(1.常用 2.一定且只操作属性)
        
"‘abc‘" v-bind:title=‘h_info‘ :def = ‘hehe‘>abc
        // 最常用的两个属性 class | style
        
class=‘a‘>
 //单类名
        
class = ‘[a,b]‘>
 // 多类名
        
class= ‘{c: d}‘>
 // 了解:c为类名,是否起作用取决于d值为true|false 开关类名
        // style
        
‘s1‘>
 //s1为一套样式
        
‘[s1, s2, {textAlign: ta}]‘> 12345
 //了解: s1,s2均为一套样式, ta是一个变量,专门赋值给textAlign(‘text-align‘)
        

    
"app">
        
        
        
"fn1">11111111111111
        
"fn2">22222222222222
        
        
"fn3(333)">3333333333333333
        
        
"fn4">4444444444444444
        
        
"fn5(555, $event)">5555555555555555

    

    
"app">
        
        
        "">
            "text" v-model="info"> 
            "text" v-model="info">

        
        
 {{ info }} 
        
        
"info">{{ info }}