VUE.js
2019-04-24 09:18:21 0 举报
AI智能生成
vue.js
作者其他创作
大纲/内容
指令
绑定元素特性
v-bind
如v-bind:title
如v-bind:title
条件
v-if
如v-if='seen'
如v-if='seen'
循环
v-for
如v-for='todo in todos'
如v-for='todo in todos'
事件监听器
v-on
如v-on:click='reverseMessage'
如v-on:click='reverseMessage'
双向绑定
v-model
如v-model='message'
如v-model='message'
组件
Vue.component(''{})
分支主题
vue.js安装
独立版本
下载vue.min.js
下载vue.min.js
https://vuejs.org/js/vue.min.js
使用 CDN 方法
Staticfile CDN(国内) : https://cdn.staticfile.org/vue/2.2.2/vue.min.js
Staticfile CDN(国内) : https://cdn.staticfile.org/vue/2.2.2/vue.min.js
unpkg:https://unpkg.com/vue/dist/vue.js, 会保持和 npm 发布的最新的版本一致。
cdnjs : https://cdnjs.cloudflare.com/ajax/libs/vue/2.1.8/vue.min.js
NPM 方法
淘宝镜像
$ npm install -g cnpm --registry=https://registry.npm.taobao.org
# 查看版本
$ npm -v
#升级 npm
cnpm install npm -g
# 升级或安装 cnpm
npm install cnpm -g
# 最新稳定版
$ cnpm install vue
命令行工具
# 全局安装 vue-cli
$ cnpm install --global vue-cli
# 创建一个基于 webpack 模板的新项目
$ vue init webpack my-project
# 这里需要进行一些配置,默认回车即可
进入项目,安装并运行:
$ cd my-project
$ cnpm install
$ cnpm run dev
$ cnpm install
$ cnpm run dev
Vue.js 目录结构
build
项目构建(webpack)相关代码
config
配置目录,包括端口号等。我们初学可以使用默认的。
node_modules
npm 加载的项目依赖模块
src
assets: 放置一些图片,如logo等。
components: 目录里面放了一个组件文件,可以不用。
App.vue: 项目入口文件,我们也可以直接将组件写这里,而不使用 components 目录。
main.js: 项目的核心文件。
static
静态资源目录,如图片、字体等。
test
初始测试目录,可删除
.xxxx文件
这些是一些配置文件,包括语法配置,git配置等。
index.html
首页入口文件,你可以添加一些 meta 信息或统计代码啥的。
package.json
项目配置文件。
README.md
项目的说明文档,markdown 格式
创建一个vue
var vm = new Vue({})
子主题
分支主题
0 条评论
下一页