zoukankan      html  css  js  c++  java
  • (3)打鸡儿教你Vue.js

    vue.js是一套构建用户界面的渐进式框架
    vue关注视图层,采用自底向上增量开发的设计

    <div id="app">
     <p>{{ message }}</p>
    </div>
    

    vue.js安装
    下载 vue.min.js 并用

    image.png

    npm install vue
    
    cd my-project
    npm install
    npm run dev
    
    # 全局安装 vue-cli
    $ cnpm install --global vue-cli
    # 创建一个基于 webpack 模板的新项目
    $ vue init webpack my-project
    # 这里需要进行一些配置,默认回车即可
    This will install Vue 2.x version of the template.
    
    For Vue 1.x use: vue init webpack#1.0 my-project
    
    # 全局安装 vue-cli
    $ cnpm install --global vue-cli
    # 创建一个基于 webpack 模板的新项目
    $ vue init webpack my-project
    # 这里需要进行一些配置,默认回车即可
    
    $ cd my-project
    $ cnpm install
    $ cnpm run dev
     DONE  Compiled successfully in 4388ms
    
    > Listening at http://localhost:8080
    

    目录结构:
    image

    build 项目构建(webpack)相关代码
    config 配置目录
    node_modules npm 加载的项目依赖模块
    static 静态资源目录
    test 初始测试目录
    package.json 项目配置文件

    image.png

    通过实例化Vue实现:

    var vm = new Vue({
    // 选项
    })
    
    {{ }} 用于输出对象属性和函数返回值
    

    image.png

    var vm = new Vue({
        el: '#vue_det',
        data: data
    })
     
    document.write(vm.$data === data) // true
    document.write("<br>") 
    document.write(vm.$el === document.getElementById('vue_det')) // true
    

    请点赞!因为你的鼓励是我写作的最大动力!

    官方微信公众号

    吹逼交流群:711613774

    吹逼交流群

  • 相关阅读:
    windows_MySQL安装详解
    nginx 基本安全优化
    pip._vendor.urllib3.exceptions.ReadTimeoutError: HTTPSConnectionPool(host='files.pythonhosted.org', port=443): Read timed out.
    浏览器缓存
    JavaScript迭代
    js模块开发
    关于逻辑删除标识字段value的设定
    c#单例(Singleton)模式实现
    css兼容小问题
    IIS网站不能访问
  • 原文地址:https://www.cnblogs.com/dashucoding/p/11140201.html
Copyright © 2011-2022 走看看