随笔分类 -  vueJS

1 2 3 4 5 6 下一页
切换页面保存页面原有的位置信息keep-alive savedPosition meta
摘要:1 只有在mode:'history'模式生效;savedPosition,这个功能只在支持history.pushState额浏览器中可用。(通过浏览器的前进/后退 按钮触发) new Router({ scrollBehavior (to, from, savedPosition) { if ( 阅读全文
posted @ 2021-06-15 18:34 半夏微澜ぺ 阅读(698) 评论(0) 推荐(0) 编辑
vue-router 路由组件传值 解耦 props
摘要:在组件中使用$route会使之与其对应路由形成高度耦合,使用props将组件和路由解耦: routes:[ { path:'/user', component:User, children:[ {path:info/:id,props:true,component:Info},//boolean值 阅读全文
posted @ 2021-04-01 19:52 半夏微澜ぺ 阅读(714) 评论(0) 推荐(0) 编辑
render 函数渲染element-ui列表
摘要:1 创建生成单元格的组件 export const exSlot = { functional: true, props: { row: Object, render: Function, index: Number, column: { type: Object, default: null } 阅读全文
posted @ 2021-03-31 17:27 半夏微澜ぺ 阅读(1115) 评论(0) 推荐(0) 编辑
webpack require.context实现自动动态加载组件
摘要:简化import 或者export各种模块 require.context(directory,useSubdirectories,regExp) 1 directory 要查找的文件路径 2 useSubDirectories 是否查找子目录 3 regExp 要匹配文件的正则 require.c 阅读全文
posted @ 2021-02-22 09:17 半夏微澜ぺ 阅读(327) 评论(0) 推荐(0) 编辑
vue源码剖析
摘要:基础的数据代理 vue的核心是它的响应式系统,而响应式的核心是利用Object.defineProperty进行数据拦截,这一届内容会深入分析Vue中两种数据拦截的方式: Object.defineProperty,Proxy, Object.defineProperty的兼容性更好,但是proxy 阅读全文
posted @ 2020-10-18 18:01 半夏微澜ぺ 阅读(117) 评论(0) 推荐(0) 编辑
vue .sync修饰符
摘要:在一些情况下,我们可能会需要对一个prop(父子组件传递数据的属性)进行‘双向绑定’,vue重新引入.sync修饰符,是作为编译时的一个语法糖,它会被扩展为一个自动更新父组件属性的v-on监听器。 普通写法: <text-decoment v-bind:title='title' v-on:upda 阅读全文
posted @ 2020-09-23 18:02 半夏微澜ぺ 阅读(168) 评论(0) 推荐(0) 编辑
vue PWA
摘要:vue创建PWA项目: vue ui 创建项目,选择手动配置,选择支持PWA 创建完成之后,项目根目录下生成registerServiceWorker.js,在main.js中注册service-worker 在vue.config.js中配置需要缓存的ajax请求 创建service-worker 阅读全文
posted @ 2020-06-23 16:51 半夏微澜ぺ 阅读(2080) 评论(0) 推荐(0) 编辑
vue-cli单页面预渲染seo-prerender-spa-plugin
摘要:1 vue-cli-plugin-prerender-spa 使用方法: vue add prerender-spa 在安装的过程中会需要安装一个chrome,网速不好可能导致不能下载,导致安装失败,可以取消chrome的安装,然后手动下载放在指定的目录下; 安装过程中选择需要预渲染的route 安 阅读全文
posted @ 2020-06-23 10:40 半夏微澜ぺ 阅读(607) 评论(0) 推荐(0) 编辑
vue key Diff算法 中央bus实现平行组件之间的传值 路由的重定向和别名 vuecli2与vuecli3 RESTFul vue自定义插件
摘要:v-for key v-for循环需要添加key属性,唯一标识,这样重新渲染的速度比较快;key的作用==》虚拟DOM的Diff算法 主要作用是快速更新虚拟dom树 lodash javascript使用工具库 中央bus实现平行组件之间的传值 $emit与$on进行组件之间的传值;注意$emit和 阅读全文
posted @ 2020-06-03 16:08 半夏微澜ぺ 阅读(279) 评论(0) 推荐(0) 编辑
vue 基础知识 总结
摘要:vue于jquery的区别 jquery主要时操作dom vue 主要是操作数据 是一个渐进式前端框架,vue中渲染dom用到了diff算法,渲染dom要比原生js快 vue参数 Vue是一个构造函数,需要传入options el 挂载根元素 template 模板字符串,有template直接渲染 阅读全文
posted @ 2020-05-28 10:40 半夏微澜ぺ 阅读(1020) 评论(0) 推荐(0) 编辑
vue3
摘要:vue3新特性 1 更快 2 更小 3 更易于维护 4 更多的原生支持 5 更易于开发使用 2.0与3.0双向数据绑定区别 2.0 数据劫持 Object.defineProperty 设置data的get set 3.0 使用代理 proxy vue3.0 不支持vue-devtools 使用ty 阅读全文
posted @ 2020-05-25 16:01 半夏微澜ぺ 阅读(305) 评论(0) 推荐(0) 编辑
vue 注意事项
摘要:1 组件名为多个单词,防止跟未来的HTML元素相冲突(所有的HTML元素都是单个单词) 2 组件的data必须时一个函数(返回data对象的函数) 3 prop定义,应该尽量详细。至少需要指定其类型。 4 为v-for设置键值 总是用key配合v-for 5 避免v-for和v-for用在一起,永远 阅读全文
posted @ 2020-05-20 17:03 半夏微澜ぺ 阅读(181) 评论(0) 推荐(0) 编辑
vue
摘要:props html的属性是大小写不敏感的,所以如果传递的属性是驼峰写法,使用的时候需要用-写法来使用; Vue.component('blog-post', { // 在 JavaScript 中是 camelCase 的 props: ['postTitle'], template: '<h3> 阅读全文
posted @ 2020-05-19 17:03 半夏微澜ぺ 阅读(111) 评论(0) 推荐(0) 编辑
vue中实现在线预览pdf文件
摘要:方法1:使用插件pdfObject(Safari不能正常显示,安卓手机的支持也不好) npm i pdfobject -S main.js Vue.prototype.$PDFObject = PDFObject; <div id="example1" style="height:600px;wid 阅读全文
posted @ 2020-05-15 17:03 半夏微澜ぺ 阅读(7134) 评论(0) 推荐(0) 编辑
babel-polyfill(解决浏览器不支持es6的问题)和es6-promise(解决不支持promise的问题)
摘要:babel-polyfill:(解决浏览器不支持es6的问题) 使用方法: 1 npm i babel-polyfill --save 2 在main.js中 import ‘babel-polyfill’ 3 修改项目入口设置: 为: 原理就是把es6的语法转换成es5的语法 es6-promis 阅读全文
posted @ 2020-05-08 13:59 半夏微澜ぺ 阅读(5048) 评论(0) 推荐(0) 编辑
Vue中用props给data赋初始值
摘要:在父组件中定义一个对象,传递给子组件,子组件使用父组件的传递的数据初始化数据,在父组件更新数据时,子组件可以同步更新: 父组件: 子组件: 结果: 初始化数据正确: 但是当父组件数据更新时,子组件不会一起更新,原因: Vue初始化时会递归地遍历data所有的属性,并使用Object.definePr 阅读全文
posted @ 2020-05-06 11:31 半夏微澜ぺ 阅读(9232) 评论(0) 推荐(0) 编辑
vue项目支持多语言(vue-i18n)
摘要:引入vue-i18n vue-i18n 是一个vue插件,主要作用就是让项目支持国际化多语言。首先我们引入这个插件: import Vue from 'vue' import Vue18n from 'vue-i18n' Vue.use(Vuei18n); vue插件的使用方法,通过全局方法Vue. 阅读全文
posted @ 2020-04-30 16:35 半夏微澜ぺ 阅读(2876) 评论(0) 推荐(0) 编辑
vue-loader
摘要:Vue-loader是一个webpack的loader,它允许你一种名为单文件组件的格式撰写Vue组件;当Vue loader编译单文件组件中的<template>块时,它也会将所有遇到的 资源URL转换为webpack 模块请求。 例如: <img src="../image.png"> 将会被编 阅读全文
posted @ 2020-04-08 17:09 半夏微澜ぺ 阅读(479) 评论(0) 推荐(0) 编辑
vue-cli创建的项目中使用sass
摘要:安装sass-loader node-sass cnpm install sass-loader node-sass -D -D是--save-dev的缩写 安装之后有的会报错: this.getReslove is not a function.... 这时因为sass-loader的版本太高的原 阅读全文
posted @ 2020-04-02 15:59 半夏微澜ぺ 阅读(1230) 评论(0) 推荐(0) 编辑
v-html
摘要:更新元素的innerHTML,注意:内容按普通HTML插入-不会作为Vue模板进行编译。在网站动态渲染反任意的HTML都是非常危险的,容易导致XSS攻击。 只在可信内容上使用V-HTML,永不用再用户提交的内容上; 再单文件组件里面。scoped的样式不会应用再v-html内容,因为那部分HTML没 阅读全文
posted @ 2020-04-02 15:47 半夏微澜ぺ 阅读(1918) 评论(0) 推荐(0) 编辑

1 2 3 4 5 6 下一页