Vue技术点整理-前言

【Vue技术点整理-前言】的更多相关文章

Vue技术点整理-前言

前言 Vue版本说明:本文档编写时,Vue稳定版本为 2.6.10 本文档编写目的为:整理Vue相关生态的技术点.和开发中经常使用到的技术点,让开发者快速上手开发,提升开发效率一,Vue开发工具:本人使用Hubilder X开发工具(Vue特别赞助商 ),选择合适自己的开发工具即可: 例如:vscode.WebStorm.sublimetext等任何文本工具都可进行开发二,目录介绍: 1,Vue技术点整理-安装引入 2,Vue技术点整理 vue-devtools 3,Vue技术点整理-Vue…

Vue技术点整理-Vue Router

路由 Vue Router 对于单页面应用来说,如果涉及到多个页面的话,就必须要使用到路由,一般使用官方支持的 vue-router 库一,Vue Router 在项目中的安装引用 1,在页面中使用<script>快速使用Vue Router开发 <!doctype html> <html> <head> <meta charset="utf-8"> <title>使用script直接引入Vue Router&l…

Vue技术点整理-Vue CLI安装详解

一,脚手架安装 Node 版本要求 Vue CLI 需要 Node.js +).你可以使用 nvm 或 nvm-windows 在同一台电脑中管理多个 Node 版本. 1,全局安装Vue CLI npm install -g @vue/cli # OR yarn global add @vue/cli 安装之后,使用以下命令查看安装是否正确 vue --version 2,快速创建一个CLI项目 vue create cli_test 此时会出现以下安装选项: 选择安装选项 PS E:\wo…

Vue技术点整理-Vue CLI

Vue CLI 是一个基于 Vue.js 进行项目快速开发的脚手架注:具体安装步骤可参考Vue CLI,默认安装的脚手架,是没有service.util等工具类的,以下主要描述如何在脚手架的基础上进行快速开发GitHub示例地址 vue-ht-cli 一,vue.config.js配置文件默认Vue CLI安装完成后,是没有这个配置文件的,需要手动在项目根目录创建,并修改使用: 以下为我简单配置的文件,更多详细配置,请参考 Vue CLI官网 vue.config.js module.exp…

Vue技术点整理 vue-devtools

注:默认浏览器调试工具,在调试vue的页面时,是不能看到vue项目的属性状态值的,所以最好是在浏览器上安装 vue-devtools,这样就可以在浏览器里面审查和调试vue的应用了 1,Chrome浏览器(需要FQ) https://chrome.google.com/webstore/detail/vuejs-devtools/nhdogjmejiglipccpnnnanhbledajbpd 2,火狐浏览器 https://addons.mozilla.org/en-US/firefox/ad…

Vue技术点整理-安装引入

Vue (读音 /vjuː/,类似于 view) 是一套用于构建用户界面的渐进式框架所谓渐进式是指: 1,如果你有一个现成的web应用,你可以将vue作为该应用的一部分嵌入其中,带来更丰富的交互体验 2,如果你需要更多业务逻辑要放到前端处理,那么Vue的核心库以及生态系统,也可以满足各样的需求一,将vue作为部分嵌入其中,在页面中使用<script>快速引用并开发 <!doctype html> <html> <head> <meta charse…

Vue技术点整理-指令

我们通常给一个元素添加 v-if / v-show 来做权限管理,但如果判断条件繁琐且多个地方需要判断,这种方式的代码不仅不优雅而且冗余. 针对这种情况,我们可以通过全局自定义指令来处理:我们先在新建个 array.js 文件,用于存放与权限相关的全局函数: // array.js export function checkArray (key) { let arr = ['1', '2', '3', '4', 'demo'] let index = arr.indexOf(key) if (i…