发表于: 2019-12-02 19:47:10

1 1243


今日完成

  • 1 创建一个静态模块
    • 顺序
  • 2 安装vue
    • 进入hello-vue模块的位置,cmd:LeYouGou\code\demo-es6\hello-vue
    • 初始化:npm init -y
    • 初始化后多了一个package.json,类似版本信息
    • 安装vue(--save是本地安装):npm install vue --save
    • 安装好vue后的结构:node_modules是通过npm安装的所有模块的默认位置
    • 安装好vue后的package.json:多了一个依赖
  • 3 入门案例
    • 1 vue声明式渲染(单向):hello.html
      • 步骤
        • 1 通过 new Vue()来创建Vue实例
        • 2 构造函数接收一个对象,对象中有一些属性
          • el:是element的缩写,通过id选中要渲染的页面元素,本例中是一个div
          • data:数据是一个对象,里面有很多属性,都可以渲染到视图中
            • name:这里我们指定了一个name属性
        • 页面中的h2元素中,我们通过{{name}}的方式,来渲染刚刚定义的name属性。
      • 代码
      • 界面
    • 2 双向绑定:hello.html
      • 步骤
        • 在data添加了新的属性:num
        • 在页面中有一个input元素,通过v-model与num进行绑定
        • 同时通过{{num}}在页面输出
      • 代码
      • 界面
    • 3 事件处理:hello.html
      • 步骤
        • 用v-on指令绑定点击事件,而不是普通的onclick,然后直接操作num
        • 普通click是无法直接操作num的
      • 代码
      • 界面

明日计划

再了解一些vue


返回列表 返回列表
评论

    分享到