随笔分类 -  vue

摘要:实现一个简单版本 Vue,仅实现了 数据响应式、依赖收集、compile编译中的html和文本编译,起名为nvue,即新 vue。 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X 阅读全文
posted @ 2022-09-06 14:43 蓓蕾心晴 阅读(47) 评论(0) 推荐(0) 编辑
摘要:参考: https://blog.csdn.net/nanxun201314/article/details/117451442 https://zhuanlan.zhihu.com/p/368238830 源码分析参考 阅读全文
posted @ 2022-09-04 22:58 蓓蕾心晴 阅读(16) 评论(0) 推荐(0) 编辑
摘要:项目中当页面很多,就不得不手动配置多个 route 配置, vite 有一个 插件 vite-plugin-pages ,则可以帮我们实现自动引入文件路由配置 npm install -D vite-plugin-pages npm install vue-router Vite configAdd 阅读全文
posted @ 2022-07-04 00:07 蓓蕾心晴 阅读(772) 评论(0) 推荐(0) 编辑
摘要:实现按需加载,主要用到两个插件 1. 按需自动加载UI组件: unplugin-vue-components 该插件主要作用是省去每次使用一个自定义组件,或UI组件库的组件时对组件的引入。兼容不同UI组件库,需要在安装对应UI组件库的前提下,并引入对应UI组件库的 resolvers。 安装 npm 阅读全文
posted @ 2022-07-03 23:55 蓓蕾心晴 阅读(4158) 评论(0) 推荐(0) 编辑
摘要:我报错了 external = resolvedConfig?.build?.rollupOptions?.external ?? void 0; ^ SyntaxError: Unexpected token '.' at wrapSafe (internal/modules/cjs/loader 阅读全文
posted @ 2022-04-06 17:55 蓓蕾心晴 阅读(2648) 评论(0) 推荐(0) 编辑
摘要:在使用vue element-ui form表单渲染的时候,会遇到这样的数据结构: 在遇到某个字段值比如list是个数组,下面多个字段值还需要继续使用rules校验时候,直接给list下面的字段绑定prop="对应的字段值",是不能校验成功的,解决办法有二: 1、在是数组的地方再套一个<el-for 阅读全文
posted @ 2019-06-03 20:21 蓓蕾心晴 阅读(34002) 评论(6) 推荐(4) 编辑
摘要:我的问题大家可能不太懂,我详细再解释一下,就是我通过遍历一个大的数组,多层遍历之后,最后的值还是一个小的数组,形如: 我想把bbb下的数组变成以逗号或者竖线分割的字符串放在iview中input中,我的代码如下: 这里kv.value就是一个数组,是经过若干层遍历的最后一层,我通过直接在v-mode 阅读全文
posted @ 2019-04-26 15:38 蓓蕾心晴 阅读(3701) 评论(0) 推荐(0) 编辑
摘要:按照iview官网介绍写的form表单验证,但是无论填写与否都不进行校验,找了很久的原因,突然才发现一个关键的地方,一定要加props!!! https://blog.csdn.net/xuaner8786/article/details/80008925 这是网友总结的iview表单验证注意点,我 阅读全文
posted @ 2019-03-14 15:11 蓓蕾心晴 阅读(8617) 评论(1) 推荐(0) 编辑
摘要:参考链接:https://segmentfault.com/q/1010000010714863 阅读全文
posted @ 2018-09-05 15:23 蓓蕾心晴 阅读(9432) 评论(1) 推荐(0) 编辑
摘要:vue项目在安卓低版本机显示空白原因: 可能的原因一: 查看安卓debug,报错,可能有箭头函数语法错误,或者其他语法问题,那可能是ES6语法问题。 这时候需要安装babel-pollyfill。 网上找到方法如下: https://blog.csdn.net/anxin_wang/article/ 阅读全文
posted @ 2018-09-04 15:01 蓓蕾心晴 阅读(2772) 评论(1) 推荐(1) 编辑
摘要:vue路由跳转: 语法没问题但是报错: 这时候说明this指向不一样了,要打印一下this 看看。发现setTimeout函数里的this指向的不是vue对象而是window,改为箭头函数即可解决 阅读全文
posted @ 2018-06-26 16:03 蓓蕾心晴 阅读(4372) 评论(0) 推荐(0) 编辑
摘要:由于我设定的页面默认进入的时候加载一次刷新函数,刚开始刷新完之后lifeList还不能及时更新过来,且我给该组件上加了v-else等判断,所以会报错: 获取当前this.$refs可以看到有这个dom元素 loadTop但是this.$refs.loadTop打印则为undefined 解决办法: 阅读全文
posted @ 2018-06-26 15:59 蓓蕾心晴 阅读(1164) 评论(0) 推荐(0) 编辑
摘要:给里面的button按钮加click事件即可。不写router-link的跳转链接。 阅读全文
posted @ 2018-06-25 17:23 蓓蕾心晴 阅读(4211) 评论(0) 推荐(0) 编辑
摘要:如图,我要实现点击关注之后列表及时更新成最新的列表。 思路很简单,主要是两点: 1、在点击关注之后去执行一个请求新的关注列表的action; 2、在vue组件中watch监听已关注列表和推荐关注列表 主要代码如下: 组件: 关注的methods: watch: followList.js vuex的 阅读全文
posted @ 2018-06-25 15:38 蓓蕾心晴 阅读(1379) 评论(0) 推荐(0) 编辑
摘要:场景: 我实际用到的是这样的,我父组件引用子组件related,父组件调用获取页面详情的方法,更新了state值related,子组件根据该related来渲染相关新闻内容,但是页面打开的时候总是先加载子组件,子组件在渲染的时候还没有获取到更新之后的related值,即使在子组件中watch该值的变 阅读全文
posted @ 2018-04-24 17:00 蓓蕾心晴 阅读(4112) 评论(0) 推荐(0) 编辑
摘要:vue安装的前提是安装了nodejs 安装淘宝镜像 npm install -g cnpm --registry=https://registry.npm.taobao.org 安装webpack cnpm install webpack -g 安装vue脚手架 npm install vue-cl 阅读全文
posted @ 2018-02-09 11:12 蓓蕾心晴 阅读(225) 评论(0) 推荐(0) 编辑
摘要:申请百度统计后,会得到一段JS代码,需要插入到每个网页中去,在Vue.js项目首先想到的可能就是,把统计代码插入到index.html入口文件中,这样就全局插入,每个页面就都有了;这样做就涉及到一个问题,Vue.js项目是单页应用,每次用户浏览网站时,访问内页时页面是不会刷新的,也就意味着不会触发百 阅读全文
posted @ 2018-01-31 15:50 蓓蕾心晴 阅读(4126) 评论(1) 推荐(0) 编辑
摘要:当二级联动比如选择国家的时候,希望选中一个国家的时候后面城市默认选中第一个城市,则给国家的select加一个@change事件就可以了 methods: 2018.3.13 更新 后来新版本的iview select value的值不支持定义对象形式,所以会报错: @change事件改为了@on-c 阅读全文
posted @ 2018-01-09 16:32 蓓蕾心晴 阅读(12576) 评论(1) 推荐(1) 编辑
摘要:首先,vue和阿里云oss上传图片结合参考了 这位朋友的 https://www.jianshu.com/p/645f63745abd 文章,成功的解决了我用阿里云oss上传图片前的一头雾水。 该大神文章里有写github地址,里面的2.0分支采用vue2.0实现,只不过这个上传图片用的是分片上传, 阅读全文
posted @ 2018-01-04 17:37 蓓蕾心晴 阅读(4182) 评论(0) 推荐(0) 编辑
摘要:直接上代码: html: css: js: 效果如图: 实现思路与注意的点: 1、获取内容的高度要等到dom加载完成之后,在mounted里加一个setTimeout函数,保证能真正获取到 2、当内容的高度高于自己设定的要展示的高度的时候,则只限定在自己要展示的高度中,加一个class解决,注意要o 阅读全文
posted @ 2017-12-27 16:58 蓓蕾心晴 阅读(4132) 评论(0) 推荐(0) 编辑