xiaocuizao的博客

本文转载：作者简介：汪玉林，高级工程师，增值产品部前端Leader，目前团队负责手Q游戏中心、手Q游戏运营、手Q阅读等项目，有丰富的Web前端架构经验。 一、前言 Vue的核心是双向绑定和虚拟DOM（下文我们简称为vdom），关于双向绑定可以参阅木琴的文章《剖析Vue原理&实现双向绑定MVVM》，vdom是树状结构，其节点为vnode，vnode和浏览器DOM中的Node一一对应，通过vn...

在vue.config.js文件中写如下代码 module.exports = { devServer: { proxy: { // 标识符： 配置项目 标识符选择域名后面的第一个 '/ajax': { target: 'http://m.maoyan.com',//目标源、...

vue 开发的时候遇到如下错误信息 [Vue warn]: Duplicate keys detected: ‘1’. This may cause an update error. [Vue warn]: Duplicate keys detected: '1'. This may cause an update error. found in ---> <Index> a...

/* webpack的配置文件 config webpadck配置 resolve webpack解析 alias 路径别名 */ const path = require( 'path' ) module.exports = { chainWebpack: function ( config ) { //chainWebpack 链式操作 ...

Vue 2.x 中，过滤器只能在 mustache 绑定和 v-bind 表达式（从 2.1.0 开始支持）中使用，因为过滤器设计目的就是用于文本转换。为了在其他指令中实现更复杂的数据变换，你应该使用计算属性。 <!-- in mustaches mustaches语法：{{}} 双大括号语法--> {{ message | capitalize }} <!-- in v-...

首先 安装： cnpm i animate.css -S 如果是整个项目使用，在入口文件 main.js中引用 import ‘animiate.css’ <transition enter-active-class='animated slideInleft' leave-active-class='animated sildeOutLeft' > //具体效果参考：ht...

首先，我们需要安装axios插件 npm i axios -D import axios from 'axios'; //在这里我们封装了一个方法 返回的是一个promise对象 const http = ({url,params,data,method}) =>{ return new Promise((resolve, reject)=>{ axi...

在一个二级路由下面跳转到一个一级路由时候，找不到页面，（只有这个一级路由），跳转到其他路由没有问题， 解决方案：查看路由配置并没有问题,发现是在有问题的一级路由设置中，没有写 /，导致同级跳转： 总结：/home 指的是跳转到根目录下的home , home 指的是跳转到同级的home下，在对应的二级路由里面没有home顾找不到 <MenuItem name="3-1"&gt...

当我们写组件的路由时，我们知道在beforeRouterEnter这个路由钩子里（指的是当我们进入路由前），通常在这个钩子里面进行数据请求（准备阶段），这个时候我们是获取不到这个this的（在组件内this指代的就是这个组件），但是有时候我们需要通过this进行设置 解决方案： beforeRouteEnter ( to,from,next ) { // console.log('bef...

⭐参考文档： https://github.com/davidroyer/vue2-editor 基本用法： 使用npm安装 npm install --save vue2-editor 代码： <template> <div id="app"> <vue-editor v-model="content"></vue-editor> ...

在路由跳转的时候，我们需要一些权限判断或者其他操作。这个时候就需要使用路由的钩子函数。 定义：路由钩子主要是给使用者在路由发生变化时进行一些特殊的处理而定义的函数。 总体来讲vue里面提供了三大类钩子，两种函数 1、全局钩子 2、某个路由的钩子 3、组件内钩子 两种函数： 1、Vue.beforeEach(function(to,form,next){}) /*在跳转之前执行*/ 2.Vue.a...

1.通过指令全局安装stylus $ npm install stylus -g 虽然全局安装了，但是在vue.js中并没有起到作用; 2.在vue.js的文件中创建了后缀名为.styl的stylus的文件，但是在编译的时候总是会报错 如何解决： 1.在package.json文件中增加如下代码： “stylus-loader”: “^3.0.1”,“stylus”: “0.52.4”, 然后回到...

使用vue开发时经常会用到ref属性，ref属性有什么作用呢？ 用法①⭐：有时候我们想在父组件中调用子组件的方法或属性，这个时候该怎么做呢？可以通过为子组件设置ref，然后通过this.$refs.refName（refName为子组件的ref值）获取到子组件，然后就可以随意调用子组件的方法和属性了。 用法②⭐：有时候我们想操作子组件或HTML标签的DOM，在vue中我们几乎不使用class或id...