~Mysunny的博客

Vue3快速上手1.Vue3简介2020年9月18日，Vue.js发布3.0版本，代号：One Piece（海贼王）耗时2年多、2600+次提交、30+个RFC、600+次PR、99位贡献者github上的tags地址：https://github.com/vuejs/vue-next/releases/tag/v3.0.02.Vue3带来了什么1.性能的提升打包大小减少41%初次渲染快55%, 更新渲染快133%内存减少54%…2.源码的升级使用Proxy

在params参数后面加？即可 { path: '/search/:keyword?', name: 'Search', component: Search, meta: { show: true } },如果没有’？’ 路径会出问题传递params参数时，空串解决办法加 undefined，不然也会跟上图一样出现路径问题this.$router.push({ name:'Search', params:{ keyw

在项目根目录下创建vue.config.js文件写入以下配置文件即可module.exports={ // 关闭eslint lintOnSave:false}

1.// 路由守卫拦截，判断是否登录并且判断当前页面是否需要验证登录信息// 路由守卫router.beforeEach((to, from, next) => { if (!localStorage.getItem('token') && !localStorage.getItem('id') && to.meta.istoken === true) { router.push('/login'); vue.prototype.$msg.fai

vue路由跳转有四种方式router-linkthis.$router.push() (函数里面调用)this.$router.replace() (用法同push)this.$router.go(n)一、不带参1.1 router-link<router-link :to="{name:'home'}"> <router-link :to="{path:'/home'}"> //name,path都行, 建议用name // 注意：route

路由传参1.query 表示参数在url后面进行传递，参数直接拼在url地址栏的后面，用？分割一下，多个参数用&分割获取使用 $route.query2.params 表示在routes定义的时候可以使用 “：参数名”的形式进行占位处理可以传递多个参数 如果要保证页面刷新之后参数还可以使用，需要在routes中做配置获取使用 $route.params(细节重点)如果想要在页面刷新或者执行其它操作之后还保留传递的参数，需要在路由表（routes）中作配置，使用 “：参数名”的形式进行占位

{ path: '/userinfo', component: userinfo, meta: {istoken: true}}可以在路由导航守卫跳转的时候判断有没有这个信息,如果有让跳转// 路由守卫router.beforeEach((to, from, next) => { if (!localStorage.getItem('token') && !localStorage.getItem('id') && to.meta.istoke

利用路由守卫来进行单独设置beforeRouteEnter(to, from, next) { window.document.body.style.backgroundColor = "rgb(242,244,247)"; next(); }, beforeRouteLeave(to, from, next) { window.document.body.style.backgroundColor = ""; next(); },...

1.老规矩—>安装 引用 应用//安装npm install vue-router//在main.js中引入并使用import VueRouter from 'vue-router'Vue.use(VueRouter)2.router文件夹新建index.js文件添加上路由配置,如下所示// 该文件专门用于创建整个应用的路由器import VueRouter from 'vue-router'//引入组件import About from '../pages/About'

vuex相当于一个公共仓库，保存着所有组件都能共用的数据。1.安装npm i vuex2.引入（在项目下新建store文件夹，然后新建一个index.js文件添加以下代码）//该文件用于创建Vuex中最为核心的storeimport Vue from 'vue'//引入Vueximport Vuex from 'vuex'//应用Vuex插件Vue.use(Vuex)//准备actions——用于响应组件中的动作const actions = { jiaWait(context,

在vue.config.js配置文件中加上devServer配置项proxy里面的’/demo’是进入代理服务器的标识，target要请求的跨域路径，pathRewrite是访问路径的时候将路径标识删除module.exports = { pages: { index: { //入口 entry: 'src/main.js', }, }, lintOnSave:false, //关闭语法检查 //开启代理服务器（方式一） /* devServer:

props方法通信(父传子)在组件标签上添加要传递的参数，在子组件中使用props来接收//app组件<template> <div> <Student name="李四" sex="女" :age="18"/> </div></template><script> import Student from './components/Student' export default { name:'App',

1 全局安装@vue/cli npm install -g @vue/cli2 切换到想要创建项目的目录，然后执行下面的命令 vue create xxxx(projectName)3 启动项目 npm run serve如果npm下载过慢，可以配置淘宝镜像： npm config set registry https://registry.npm.taobao.org脚手架文件分析node_modulespublicfavicon.ico..

VueComponent.prototype.__proto__===Vue.prototype有了这个内置关系，组件实例对象就可以访问Vue原型上面的方法和属性

javascript数据代理在js中我们可以调用Object.definProperty()给对象绑定属性，当读取绑定的属性是，get函数就会被调用，当修改绑定的属性时，set函数会被调用，这样就形成了数据代理。<!-- 数据代理：通过一个对象代理对另一个对象中属性的操作（读/写） --> <script> let obj = {x:100} let obj2 = {y:200} Object.defineProp..

Vue是什么？Vue是一套用于构建用户界面的渐进式javaScript框架Vue简单的应用：就只需要小巧的核心库Vue复杂的应用：可以引入各式各样的Vue插件来完成功能Vue的特点采用组件化模式，更好的提高代码复用率、并且代码更好去维护声明式编码，让编码人员无需直接操作DOM,提高开发效率<!-- 遍历对象 --> <ul> <li v-for="(value,key) in car" :key="key">