VUE
文章平均质量分 61
VUE实战项目总结
Hannah_Hannah_
日日是好日,积极生活、努力工作、不断学习。
“过一个平凡无趣的人生实在太容易了,你可以不读书,不冒险,不运动,不写作,不外出,不折腾……但是,人生最后悔的事情就是:我本可以。”
展开
专栏收录文章
- 默认排序
- 最新发布
- 最早发布
- 最多阅读
- 最少阅读
-
Vue导航守卫 -- 登录
Vue导航守卫 -- 登录,有些页面只能登录才能查看,比如:购物车原创 2022-08-25 22:02:46 · 773 阅读 · 0 评论 -
临时标识--免登陆uuid
就是一个字符串,可以让用户查看购物车等需要注册登录的信息,通常用uuid就可以创建这个字符串。临时标识 在请求拦截器中加,存储在vuex中的state:userTempId正在上传…重新上传取消。原创 2022-08-25 21:58:24 · 576 阅读 · 0 评论 -
vue常用指令
v-model(表单元素设置了之后会忽略掉value,checked,selected),常用在表单 及 。item表示当前被遍历的数组元素,item表示一个数组,一般用v-for都要绑定key,而最好用id=key。对DOM元素进行隐藏,例如为false时,添加 display:none 样式进行隐藏。如若进行页面默认是不展示,并且后期可能也不需要展示,那么就用v-if性能更好。一般用于具有循环规律的场景,如表格--隔行颜色加深,或者淘宝的每个商品的获取。......原创 2022-08-08 23:14:07 · 290 阅读 · 0 评论 -
vue项目引用swiper轮播图插件及报错解决
1、下载插件(不建议下载最新的版本,因为vue2对最新的是wiper版本有不兼容)npm i swiper@6.8.1 --save下载完成后会在package.json文件中出现:2、进行基本配置2.1在main.js中 import swiper from 'swiper' import 'swiper/swiper-bundle.css'Vue.config.productionTip = falsenew Vue({ router, store,.原创 2022-04-28 23:02:45 · 6480 阅读 · 0 评论 -
vue-cli创建vue项目详细步骤
一、安装node环境二、下载vue和vue-cli脚手架命令:npm i-g vue ; npm i -g @vue/cli三、在想要创建的位置路径下打开cmd(直接点击路径输入cmd即可打开当前位置的终端)四、创建vue项目,输入命令( vue create 项目名称)五、进入详细选择(上下 方向键选择,空格键确定,enter进入下一步)1、默认vue2版本和默认vue3版本都是有Eslint和Babel的,Eslint是代码规范的,Babel是将ES6转化为ES.原创 2022-04-15 23:23:33 · 23637 阅读 · 3 评论 -
Vue中的 v-if 和 v-show条件渲染
一、v-if 和v-show的共同点1、都能控制DOM元素的显示和隐藏二、v-if 和v-show的区别1、v-if: 1.1:v-if 是直接将dom元素添加或者删除,是实现真正的条件渲染,它会确保在切换过程中条件块内的事件监听器和子组件适当地被销毁和重建。 1.2:v-if由false变为true的时候,触发组件的beforeCreate、create、beforeMount、mounted钩子,由true变为false的时候触发组件的beforeDestor...原创 2022-05-31 17:46:48 · 1730 阅读 · 0 评论 -
Invalid handler for event “full-change“: got undefined,或者 方法或属性不是实例,是在渲染期间使用
1、报错1:[Vue warn]: Invalid handler for event "full-change": got undefined报错1的原因:绑定的方法不是放在methods:{}里。比如我把绑定的函数写在了computed:{}里就会报这个错。根据网上博客Invalid handler for event "": got undefined进行更改---更改结果:没有报错但功能依然没有实现。2、报错2:[Vue warn]: Property or method "...原创 2022-04-12 17:36:42 · 7164 阅读 · 0 评论 -
vscode 中vue导入模块的@路径提示以及采用@后报错显示not found
上图点击【扩展设置】后进入下图点击上图的【步骤 2】之后,进入下图的 【settings.json】文件中,添加下列框出的代码、以上是下载的插件的基本配置接下来是取别名的配置如果没有jsconfig.json文件,那就自己建一个(!!!名字要一摸一样) 以上情况就基本上成功了,如果@路径还不生效的话 ,看看自己的文件中是否使用了tsconfig.json文件,如果有的话,需要在tsconfig.json中添加配置 "allowJs": true,最后就成功啦!!!!!.........原创 2022-06-13 21:00:40 · 7556 阅读 · 0 评论 -
vue中使用better-scroll插件
一、better-scroll使用场景和优势better-scroll 是一款重点解决移动端(已支持 PC)各种滚动场景需求的插件。它的核心是借鉴的 iscroll 的实现,它的 API 设计基本兼容 iscroll,在 iscroll 的基础上又扩展了一些 feature 以及做了一些性能优化。二、在vue中使用better-scroll插件(1)先下载 npm i beter-scroll(2)再进行导入注册使用(在vue中一般建议封装一个better-scroll,因为一般会有很多滚动原创 2022-05-20 11:31:54 · 1665 阅读 · 0 评论 -
初步使用VUE基本步骤
Windows系统一、先下载node.js,为了之后可以使用npm命令下载第三方包下载地址:建议安装LTS版本Download | Node.js二、安装淘宝镜像(因为经常下载第三方包速度比较块-节省时间)(设置淘宝镜像:大家都知道国内直接使用 npm 的官方镜像是非常慢的,所以这里推荐使用淘宝 NPM 镜像。)使用管理员身份打开cmd,在打开的命令行界面输入:nmp i -g cnpm --registry=https://registry.npm.taobao.org三.原创 2022-04-12 17:07:30 · 2745 阅读 · 0 评论
分享