function makeMap ( str, expectsLowerCase ) { var map = Object.create(null); var list = str.split(','); ; i < list.length; i++) { map[list[i]] = true; } return expectsLowerCase ? function (val) { return map[val.toLowerCase()]; } : function (val) { ret…
在vue中需要比较两个数组取相同值 一个大数组一个 小数组,小数组是大数组的一部分取相同ID的不同name值 有两种写法,两个for循环和map写法 const toName = (ids, arr) => { let a = []; ids = String(ids) && String(ids).split(',') || []; for (let i = 0, length = arr.length; i < length; i++) { for (let j = 0,…
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>vue中的变异方法:splice()方法</title> <script type="text/javascript" src="vue.js"></script> </head>…
vue中我们会遇到很多父子组件通信的需求, 下面简单列一下,父子组件通信的几种情况 1:父组件向子组件传值:使用prop向子组件传值: 2:子组件实时监听父组件传来的值的变化:使用watch去监听父组件传来的值: 3:父组件可以通过this.$refs.name.去访问子组件的值或方法: 4:子组件可以通过this.$parent.去访问父组件的值或方法: 总结了一下,感觉好像挺全面的,好像不缺啥了.... 但是仔细一想,父组件如何去监听子组件的值呢?如何根据子组件中的某个值的变化,父组件作出响…
1.computed和methods 共同点:computed能现实的methods也能实现: 不同点:computed是基于它的依赖进行缓存的.computed只有在它的相关依赖发生变化才会重新计算求值. 而只要它的相关依赖没有发生变化,多次访问会立即返回之前的计算结果,而不必再次执行计算.相比之下,每当触发重新渲染时,调用方法将总会再次执行函数.也就是说当我们不希望有缓存,用方法来替代. 2.watch和computed 共同点:都是以Vue的依赖追踪机制为基础的,都是希望在依赖数据发生改变…
先前我们在 从 Vue parseHTML 所用正则来学习常用正则语法 这篇文章中分析了 parseHTML 方法用到的正则表达式,在这个基础上我们可以继续分析 parseHTML 方法. 先来看该方法整体结构: function parseHTML(html, options) { // ... let index = 0; let last, lastTag; while (html) { // ... } parseEndTag(); } 从整体结构上说就是通过从头开始遍历 html 元素…
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>vue-router之实例讲解定义一下单页面路由:</title> <script src="vue.js"></script> <script src="vue-router.js"&g…
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>变异方法:push/unshift pop/shift</title> <script src="vue.js"></script> </head> <body> <div id=&q…
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>变异方法push的留言版实例讲解</title> <script src="vue.js"></script> </head> <body> <div id="lantian"> <li v-…
var Vue = require('vue/dist/vue.common.js'); document.querySelector('body').append(document.createElement('div')) new Vue({ template:'<editor v-model="content" lang="json" height="500" @init="initEditor"></…