随笔分类 - Vue.js
摘要：全局方法 用vuejs构建单页应用时都会用到一些全局方法，比如发ajax请求时喜欢用axios挂载到vue原型上，如下： // 1 引入vue和axios import Vue from 'vue' import axios from 'axios' // 2 对axios的一些封装 // code
阅读全文
摘要：vue中引入vue-i18n方式见链接：https://www.cnblogs.com/vickylinj/p/9537717.htmlvue 中文言分成两个文件分别管理：en.js: 1 const en = { 2 message: { 3 'hello': 'hello, world', 4
阅读全文
摘要：在js中引入vue-i18n插件，调用插件的实例.t('文言名')方法即可： //js文件 import VueI18n from 'vue-i18n' // 注册i18n实例并引入语言文件，文件格式等下解析 const i18n = new VueI18n({ locale: 'zh', mess
阅读全文
摘要：用过vue组件的前端同学应该都遇到过一个问题，就是在当前页的组件有自定义样式，而用了scoped编译出的样式对组件内部并不起作用，最后要写全局样式才能有效，但是可能会污染到其他组件，其实我们可以用/deep/来解决此问题。 关于scoped请查看：https://www.cnblogs.com/vi
阅读全文
摘要：key 的特殊属性主要用在 Vue 的虚拟 DOM 算法，在新旧 nodes 对比时辨识 VNodes。如果不使用 key，Vue 会使用一种最大限度减少动态元素并且尽可能的尝试就地修改/复用相同类型元素的算法。而使用 key 时，它会基于 key 的变化重新排列元素顺序，并且会移除 key 不存在
阅读全文
摘要：一、Webpacked Assets 为了回答这个问题，我们首先需要了解Webpack如何处理静态资产。在 *.vue 组件中，所有模板和CSS都会被 vue-html-loader 及 css-loader 解析，并查找资源URL。例如，在 <img src="./logo.png">和 back
阅读全文
摘要：1.配置镜像 by config command npm config set registry http://registry.cnpmjs.orgnpm info underscore （如果上面配置正确这个命令会有字符串response） 命令行指定 npm --registry http:/
阅读全文
摘要：一、vue文件 vue文件是一个自定义的文件类型，用类HTML语法描述一个vue组件，每个.vue组件包含三种类型的顶级语言快< template>< script>< style>，还允许添加自定义的模块； 如果你喜欢分隔你的.vue文件到多个文件中，你可以通过src属性导入外部文件： 二、vue
阅读全文
摘要：实现原理：vueRouter控制前端页面跳转路由，当登录成功后，返回用户登录token信息，将token信息放到store中，router路由跳转取store中状态有token时，当取到token时跳转到首页，反之跳转到登录页。 步骤： 1.登陆校验： 2.路由配置： 3.全局导航守卫： vueRo
阅读全文
摘要：正如其名，vue-router 提供的导航守卫主要用来通过跳转或取消的方式守卫导航。有多种机会植入路由导航过程中：全局的, 单个路由独享的, 或者组件级的。 记住参数或查询的改变并不会触发进入/离开的导航守卫。你可以通过观察 $route 对象来应对这些变化，或使用 beforeRouteUpdat
阅读全文
摘要：1.重定向的地址不需要接收参数 把"/"重定向到"/index" 2.重定向的地址需要接收参数然而没有传参 不会改变地址，页面不会报错但是也不会显示内容 3.重定向的地址需要接收参数并且传参 重定向改变了路径，此时路径并不是goParams/1993/yq love zn而是params/1993/
阅读全文
摘要：总共添加两个子路由，分别命名Collection.vue（我的收藏）和Trace.vue（我的足迹） 1、重构router/index.js的路由配置，需要使用children数组来定义子路由，具体如下： 2、Me.vue的代码如下： 3.页面效果： 当访问到http://localhost:808
阅读全文
摘要：一般我们在两种常见的情况下会倾向于这样做： 情形1：为了过滤一个列表中的项目 (比如 v-for="user in users" v-if="user.isActive")。在这种情形下，请将 users替换为一个计算属性 (比如 activeUsers)，让其返回过滤后的列表。 情形2：为了避免渲
阅读全文
摘要：一.简介 NPM是随同NodeJS一起安装的包管理工具，能解决NodeJS代码部署上的很多问题，常见的使用场景有以下几种： 允许用户从NPM服务器下载别人编写的第三方包到本地使用。 允许用户从NPM服务器下载并安装别人编写的命令行程序到本地使用。 允许用户将自己编写的包或命令行程序上传到NPM服务器
阅读全文
摘要：这些是用于发出请求的可用配置选项。 只有url是必需的。 如果未指定方法，请求将默认为GET。 参照：http://www.axios-js.com/docs/
阅读全文
摘要：一、axios 简介 1.axios特征 axios 是一个基于Promise 用于浏览器和 nodejs 的 HTTP 客户端，它本身具有以下特征： 从浏览器中创建 XMLHttpRequest 从 node.js 发出 http 请求 支持 Promise API 拦截请求和响应 转换请求和响应
阅读全文
摘要：keep-alive 包裹动态组件时，会缓存不活动的组件实例，而不是销毁它们。和 <transition> 相似，<keep-alive> 是一个抽象组件：它自身不会渲染一个 DOM 元素，也不会出现在父组件链中。 keep-alive生命周期钩子函数：activated、deactivated 使
阅读全文
摘要：1.this.$router.push() 描述：跳转到不同的url，但这个方法会向history栈添加一个记录，点击后退会返回到上一个页面。 2.this.$router.replace() 描述：同样是跳转到指定的url，但是这个方法不会向history里面添加新的记录，点击返回，会跳转到上上一
阅读全文
摘要：1.父组件与子组件传值props 1.1定义父组件，父组件传递 inputText这个数值给子组件: //父组件 //引入的add-widget组件 //使用 v-bind 的缩写语法通常更简单： <add-widget :msg-val="msg"> //这里必须要用 - 代替驼峰 // HTML
阅读全文
摘要：一.方法method与计算属性computed的区别 方法method：每当触发重新渲染时，调用方法method将总会再次执行函数； 计算属性computed：计算属性computed是基于它们的响应式依赖进行缓存的，只在相关响应式依赖发生改变时它们才会重新求值； 二.侦听器watch与计算属性co
阅读全文
浙公网安备 33010602011771号