微信登录

前端 - Vue.js

VUE CLI - 安装

置顶帖 - 本帖收集增加的内容

安装 - CDN/下载/npm

安装 - 浏览器插件 - Vue.js devtools

基础 - VSCode

基础 - 启动Vue - 别人的项目

基础 - 目录结构

例子 - 少写.html - 写.vue

文件解释 - package.json和package-lock.json

文件解释 - index.html

文件解释 - src/main.js - 主入口

文件解释 - src/App.vue - 主入口组件

文件解释 - src/router.js - 路由

文件解释 - src/components/Hello.vue - 主页

变量 - var - 全局 + 可变

变量 - let - 局部 + 可变

变量 - const - 局部 + 不可变

变量 - 环境变量 - .env.production

语法 - 插值 - Mustache -

语法 - 插值 - v-once -

语法 - 插值 - v-text - 改变内容

语法 - 插值 - v-html - 富文本

语法 - 插值 - v-pre -

语法 - 插值 - v-block -

语法 - 事件监听 - v-on:xxx

语法 - 事件监听 - @: -

语法 - 条件 - v-show

语法 - 条件 - v-if

语法 - 绑定属性 - v-bind:xxx - 单向绑定

语法 - 循环 - v-for

语法 - 表单绑定 - v-model - 双向绑定

Html接受数据{{}} - computed、methods

组件化拆分 - Html拆分 - components子组件

父子组件传值 - 子 -> 父

父子组件传值 - 父 -> 子

import - 导入

export default - components:{} - 跳转页面

export default - filters:{} - 过滤器

export default - data(){} - 数据响应变化

export default - created(){} - 生命周期函数 - 创建

export default - methods:{} - 定义方法

export default - mounted:{} - 进入页面就开始执行

组合 - 动态改变css

打包 - vue2.x - 有build、config文件夹

VUE CLI - webpack

VUE CLI - 安装

VUE CLI - 配置

网络封装 - JSON

网络封装 - axios

项目部署 - Nginx - windows

项目部署 - Nginx - Linux

模块化拆分 - Js拆分 - utils子模块

VUE CLI - 安装

Vue CLI3安装、卸载

npm install -g @vue/cli
npm uninstall -g @vue/cli

Vue CLI2安装、卸载

npm install -g vue-cli
npm uninstall -g vue-cli

Vue CLI3初始化项目

vue creat my_project

Vue CLI2初始化项目

vue init webpack my_project

创建时要配置的项目

Project name 项目名称，直接回车用my_project
Project description 项目详情
Author 作者
Vue build 回车 standalone
Install vue-route 后面可以自己安装
EXLint 编写js代码的规范，公司可能严格y，其他可以n
unit text 单元测试，公司可能要y
e2e test end to end 端到端的测试，通常安装Nightwatch自动化测试框架

project initialization finished!
说明创建成功
过程中可能有WARN但是不影响我们使用