Vue中常用指令 & 事件修饰符

1. 指令

• 指令带有前缀 v-，以表示它们是 Vue 提供的特殊特性。它们会在渲染的 DOM上应用特殊的响应式行为。

2. vue中的v-cloak v-text v-html v-on v-bind指令

v-cloak: 在vue.js中 v-cloak 这个指令是防止页面加载时出现 vuejs 的变量名而设计的.
v-text: 同插值表达是作用一样，但是会覆盖原本的内容；
v-html: 将内容以html元素渲染；
v-bind: 用于属性的绑定，可简写为 ':';
v-on: 用于事件的绑定，可简写为'@';

    
    
++++++++ {{ msg }} ----------
    
==================
    
    
    
{{msg2}}
    

    
1212112
    
    
    
    
    
    
    
  
 

  

案例 跑马灯效果

分析：
1. 给 【浪起来】 按钮，绑定一个点击事件 v-on @
2. 在按钮的事件处理函数中，写相关的业务逻辑代码：拿到 msg 字符串，然后 调用 字符串的 substring 来进行字符串的截取操作，把 第一个字符截取出来，放到最后一个位置即可；
3. 为了实现点击下按钮，自动截取的功能，需要把 2 步骤中的代码，放到一个定时器中去；

    
    

    
{{ msg }}