vue基础

vue基础

vue-router
路由
element-ui
组件库，提供了很多漂亮组件，比如按钮、模态框、表格、通知…

1. mvvm思想
   m 数据模型（一般表示从服务器端获取的数据，维护到vue中）
   v 视图 ，模板
   vm vue的核心机制，完成了数据绑定等dom操作
2. vue实例
   export {
   // m 表示数据模型，数据可以来自于后端，也可以自定义
   data(){
   return {
   msg:“hello vue”,
   list:[{name:“terry”,age:3},{name:“tom”,age:2}]
   }
   }
   }
3. 模板语法

1. 双大括号
  将变量的值直接进行输入
2. 列表渲染
  将数据内容进行迭代，然后渲染的页面中
  <ul class="list">
    <li v-for="item in list" :key="item.id">{{item.name}} </li>
  </ul>
3. 条件渲染
  当满足某个条件的时候，该视图才会被渲染出来

4. 事件机制

1. 事件绑定
  <button @click="handler1">按钮1</button>
  <button @click="handler2('hello')">按钮2</button>

  {
    methods:{
      hander1(){

      },
      handler2(val){
        val // hello
      }
    }

  }
2. 事件修饰符
  有些标签，比如a/form在点击后都可以发生跳转，这个就属于标签的默认事件行为。如果我们再绑定事件，会先执行我们绑定的事件，再执行默认事件。
  <a href="http://www.briup.com" @click.prevent="bar">杰普一下</a>