Vue学习（六）

Vue学习（六）

命名视图实现经典布局

1. 标签代码结构：

1. JS代码：

1. CSS 样式：

watch属性的使用

考虑一个问题：想要实现 名 和 姓 两个文本框的内容改变，则全名的文本框中的值也跟着改变；（用以前的知识如何实现？？？）

1. 监听data中属性的改变：

     +
     =
    {{fullName}}
  

  

1. 监听路由对象的改变：

    登录
    注册

    
  

  

computed计算属性的使用

1. 默认只有getter的计算属性：

     +
     =
    {{fullName}}
  

  

1. 定义有getter和setter的计算属性：

    
    
    
    

    {{fullName}}
  

  

watch、computed和methods之间的对比

1. computed属性的结果会被缓存，除非依赖的响应式属性变化才会重新计算。主要当作属性来使用；
2. methods方法表示一个具体的操作，主要书写业务逻辑；
3. watch一个对象，键是需要观察的表达式，值是对应回调函数。主要用来监听某些特定数据的变化，从而进行某些具体的业务逻辑操作；可以看作是computed和methods的结合体；