Vue知识点
文章平均质量分 54
almostall
这个作者很懒,什么都没留下…
展开
-
导航守卫的基本使用
导航守卫监听从哪里跳到哪里//设置网页的title,除下面代码还需要在对应组件中设置meta属性router.beforeEach((to,from,next)=>{//从from跳转到todocument.title=to.matched[0].meta.title;next();})keep-alive保持活跃状态,避免组件重复被创建和销毁。另外提到了周期函数created(),destroyed()还有只有用到keep-alive才有效的actived()和deacti原创 2021-07-17 10:08:49 · 164 阅读 · 0 评论 -
路由和转发
路由路由的两种机制:路由和转发路由中有一个映射表【内网ip1:电脑mac地址1; 内网ip2:电脑mac地址2 …】电脑mac地址是电脑物理地址,是电脑的唯一标识前端路由发展阶段:后端渲染和后端路由,前后端分离(这个阶段没有路由概念),前端路由1.后端渲染和后端路由后端渲染,jsp:java server page.当浏原创 2021-07-17 10:07:44 · 491 阅读 · 0 评论 -
vue-router的基本使用
vue-router的基本使用映射组件和url1.搭建路由框架准备工作有已经装好vue-router。(通过npm install vue-router 或者在新建脚手架项目时直接选择安装)在src/router/index.js中搭建基本的路由框架。import Vue from 'vue'import Router from 'vue-router'import Title from './components/title'import Result from './comp原创 2021-07-17 10:06:41 · 107 阅读 · 0 评论 -
Vue CLI
Vue CLICommand-Line Interface,命令行界面,俗称脚手架。使用vue-cli可以快速搭建Vue开发环境以及webpack配置.Vue脚手架使用前提:Node,Webpack.使用1.全局安装Vue脚手架:npm install -g @vue/cli(国内可以使用淘宝npm镜像使用cnpm代替npm。命令:npm install -g cnpm --registry=https://registry.npm.taobao.org )2.步骤1默认安装的是脚手架1,所以原创 2021-07-17 10:05:26 · 92 阅读 · 0 评论 -
plugin
pluginplugin(插件),通常是对某个现有的架构进行扩展,webpack中的插件就是对现有功能的各种扩展,比如打包优化,文件压缩等。1.loader和plugin的区别loader主要用于转换某些类型的模块,loader是一个转换器。plugin是插件,它是对webpack本身的扩展,是一个扩展器。2.如何使用plugin通过npm安装需要使用的plugin(某些webpack已经内置的插件不需要安装。)在webpack.config.js中配置插件。3.使用plugin原创 2020-11-09 14:43:48 · 421 阅读 · 1 评论 -
初识Webpack
WebpackWebpack是现代javascript模块打包工具,它与gulp等打包工具相比最大的特点是**模块化 **安装Webpack需要依赖node环境才能正常运行,而node环境自带软件包管理工具(node package manager)即npm以执行更多代码。安装完node环境后,通过npm install webpack@3.6.0 -g安装即可。(此处为全局安装webpack3.6.0版本)Webpack的基本使用项目目录如下:a1.js为需要导入的模块,m原创 2020-11-06 16:07:22 · 96 阅读 · 0 评论 -
Vue v-model的使用
v-model的使用v-model在Vue用于表单值和数据的双向绑定基本使用<body> <div id="app"> <!-- <input type="text" v-model="message"> --> <!-- 等同于以下代码,使用v-bind和v-on两个指令实现双向绑定 --> <!-- input表单有一个input事件,当表单中的内容产生变化时触发 --> <!原创 2020-10-29 17:26:37 · 150 阅读 · 0 评论 -
v-for的使用
v-for的使用v-for用于遍历数组和对象。 <div id="app"> <!-- (参1,参2,参3)这几个参数分别对应谁?谁更重要就把谁放在前面,即value,key,index --> <!-- 遍历数组中的内容 --> <h3 v-for="item in arg" :key="item">{{item}}</h3> <!-- 遍历数组中的内容并加上index --> <原创 2020-10-22 16:05:05 · 179 阅读 · 0 评论 -
v-show和v-if的区别
v-show和v-if的区别v-show和v-if都可以用于决定一个元素是否显示。先说明一下v-if的使用方法,v-if常与v-else-if,v-else使用,将这三个命令与if–else if–else联系起来就非常好理解了。以下为一个小案例展示其用法。<body> <div id="app"> <h3 v-if="score>=90">优秀</h3> <h3 v-else-if="score>=80">原创 2020-10-22 14:39:34 · 137 阅读 · 0 评论