什么是Vue.js

Vus.js是一套开发web页面的Javascript脚本框架。

框架特点:

  • 单页模式
  • 轻量级框架
  • MVVM设计模式
    官方网站
  • https://cn.vuejs.org/

    知识点

    安装及使用
    • 1、下载框架库，项目通过script加载CDN文件
    • 2、项目基于npm安装
      • 命令 $ npm i vue —save-dev
      • 国内使用淘宝资源类库
      • 命令 $ cnpm i vue —save-dev
    • 3、项目通过bower来安装
      • 命令 bower i vue —save-dev

代码 第一个helloworld程序

第一种方式 JS加载CND文件

  1. <html>
  2. <head>
  3. <title>Hello World</title>
  4. </head>
  5. <script src="https://unpkg.com/vue/dist/vue.js"></script>
  6. <div id="didi-navigator">
  7.   <ul>
  8.     <li v-for="tab in tabs">
  9.       {{ tab.text }}
  10.   </ul>
  11. </div>
  12. <script>
  13.   new Vue({
  14.     el: '#didi-navigator',
  15.     data: {
  16.       tabs: [
  17.         {text : '巴士'},
  18.         {text : '快车'},
  19.         {text : '专车'},
  20.         {text : '顺风车'},
  21.         {text : '出租车'},
  22.         {text : '代驾'}]
  23.     }
  24.   });
  25. </script>
  26. </html>

更多相关文章

  1. 基于 Swoft 协程框架的 PHP 微服务治理
  2. Shell的18条常用命令整理
  3. 汇总：Linux文件管理的50个命令
  4. 关于Cisco Smart Install存在远程命令执行漏洞的情况通报
  5. 零基础入门 实战mpvue2.0多端小程序框架
  6. Linux 三剑客 Awk、Sed、Grep 命令详解
  7. 1819、shell脚本基础-bash变量和逻辑运行0脚本编程基础及配置文
  8. echo 命令 sleep 命令
  9. date 命令修改时间

随机推荐

  1. 关于“Only the original thread that cr
  2. Android换肤机制
  3. Android点击事件的四种写法
  4. Android编程: 环境搭建、基本知识
  5. 杂七杂八2
  6. Android去除标题栏及自定义title栏
  7. android资源配置文件
  8. 背景图片显示问题 图片显示错误 android
  9. Cordova 入门AndroidStudio集成
  10. android动画效果处理