随笔分类 - Vue
摘要：单页应用的问题： 1、首屏渲染等待时间长：必须得等js加载完毕，并且执行完毕，才能渲染出首屏 2、seo不友好：爬虫只能拿到一个div，认为页面是空的，不利于seo（公司的宣传页会比较在乎seo） SSR 为了解决这两个问题，出现了SSR解决方案，后端渲染出完整的首屏dom结构返回，前端拿到的内容带
阅读全文
摘要：项目配置 配置文件入口： vue.config.js 做一些基础配置：指定应用上下文、端口号、title 命令：vue inspect 可以拿到整个webpack的全部配置 命令：vue inspect --rules 查看当前项目下所有的规则 命令：vue inspect --rule vue 查
阅读全文
摘要：这里使用的是vue2.6.9版本，可以在GitHub上下载 调试vue项目的方式 安装依赖：npm i 安装打包工具：npm i rollup -g 修改package.json里面dev脚本 执行打包： npm run dev 修改samples里面的文件，引用新生成的vue.js 整体启动顺序（
阅读全文
摘要：知识要点 vue工作机制 vue响应式原理 依赖收集与追踪 编译compile Vue工作机制 在new Vue() 之后。Vue会调用进行初始化，会初始化生命周期、事件、props、methods、data、computed 与 watch 等。其中最重要的是通过 Object.definePro
阅读全文
摘要：render函数 一些场景中需要 JavaScript 的完全编程能力，这时可以用渲染函数，它比模板更接近编译器 render(h) { return h(tag, {...}, [children]) } createElement 函数 插件 例如：移动 $bus 到插件 组件混入：mixin
阅读全文
摘要：vue-router 安装： 配置 指定路由器 路由视图 导航链接 路由嵌套 应用界面通常由多层嵌套的组件组合而成。同样的，URL中各段动态路径也按某种结构对应嵌套的各层组件。 配置嵌套路由，router.js 动态路由 我们经常需要把某种模式匹配到的所有路由，全部映射到同一个组件 详情页路由配置，
阅读全文
摘要：组件通信 1、父组件 => 子组件 属性props 引用refs 特别适用于想要操作某些DOM结构时，refs就是这些DOM节点 this.$refs 需要在mounted 中 或之后调用，因为父组件先于子组件挂载，在父组件 created 的时候，子组件还没挂上去，所以访问不到 子组件chidre
阅读全文
摘要：index.html文件 kvue.js文件 --> 类似vue.js文件 compile.js 用途：编译器
阅读全文
摘要：kvuex.js 文件 （实现vuex插件） kindex.js 文件 相当于store.js文件 测试文件 vue文件
阅读全文
摘要：main.js中 kvue-router.js 文件 > 插件实现 krouter.js > 相当于router.js
阅读全文
摘要：插槽语法是Vue实现的内容分发API，用于复合组件开发，该技术在通用组件库开发用有大量应用 Vue 2.6.0 之后采用全选 v-slot 语法取代之前的 slot slot-scope 1、匿名插槽 2、具名插槽：将内容分发到子组件指定的位置 3、作用域插槽，子组件可以自行展示内容// paren
阅读全文
摘要：1、父组件=>子组件，属性传递 父组件：传值 <HelloWorld msg="Welcome to your vue app" /> 子组件：接收 props{ msg: String } 2、父组件=>子组件，使用ref传值 此处使用mounted而不是使用created，因为挂载时子组件才加载
阅读全文
摘要：上述代码应用场景， h5聊天页，由于created的时候只是页面元素的节点加载进来了，图片、音频等资源还未加载完全，导致滚轮无法拉至最底部 this.$nextTick 也不起作用
阅读全文
摘要：$nextTick Vue.nectTick() 是在下次DOM更新循环结束之后执行延迟回调，在修改数据之后使用$nextTick，则可以在回调中获取更新后的DOM（dom的改变是发生在nextTick()之后），这个方法作用是当数据被修改后使用这个方法，会回调获取更新后的dom再render出来
阅读全文
摘要：.sync 修饰符以前存在于 vue1.0版本里，在2.0版本中移除了 .sync 但是在2.0发布之后的实际应用中，我们发现 .sync 还是有其适用之处的，比如在开发可复用组件库时。我们需要做的只是让子组件改变父组件状态的代码更容易被区分。从2.3.0起，Vue重新引入了 .sync修饰符，但是
阅读全文
摘要：问题情况： 上述代码会导致：每次更改input框中的内容时，所有input框的value都会同步改变 问题原因： Vue不能检测以下变动的数组： 当你利用索引直接设置一个项时，例如：vm.items[indexOfItem] = newValue 当你修改数组的长度时，例如：vm.items.len
阅读全文
浙公网安备 33010602011771号