![](https://img-blog.csdnimg.cn/20201014180756927.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
vue
火红_
这个作者很懒,什么都没留下…
展开
-
vue商城之综合销量价格等排序
【代码】vue商城之综合销量价格等排序。原创 2022-12-30 14:49:23 · 548 阅读 · 0 评论 -
Property or method “changeColor“ is not defined on the instance but referenced during render.Make su
这是因为我多了一个methods,遇到这种就检查看看哪里是否有重复的。原创 2022-12-21 18:12:46 · 493 阅读 · 0 评论 -
vue之sourcemap
在前端项目投入生产环境之前,需要对js代码进行压缩,从而减小代码体积,提高运行效率。例如压缩后的代码:代码压缩之后就会压缩在一起变成一行代码,变量被替换成没有任何意义的名字,空行和注释都被剔除。当你进行bug调试的时候,就找不到头绪。这时就需要用到sourcemap了,sourcemap是一个信息文件,里面存储这你未压缩之前代码的位置信息。当你出错调试的时候,调试工具就会根据sourcemap记录的位置信息,直接显示未压缩前的代码。webpack默认开启sourcemap。原创 2022-11-01 15:52:05 · 5170 阅读 · 1 评论 -
node没安装:无法将“node.exe”项识别为 cmdlet、函数、脚本文件或可运行程序的名称。请检查名称的拼写,如果包括路径,请确保路径正确,然后再试一次。
将node.exe这一个放入npm目录。这是node丢失的现象。原创 2022-08-22 10:30:51 · 2242 阅读 · 0 评论 -
win版node安装webpack和Vue及执行js文件
========== 安装node ============1、下载地址https://www.cnblogs.com/DuJiu/p/13503553.html2、安装完成后node -v //查看版本npm -v //查看npm版本npm i npm -g //升级npmnpm install -g 全局安装(global)和本地安装(local)的区别带了-g说明全局安装.不带说明安装在当前目录;具体区别:1.安装位原创 2021-05-26 10:32:00 · 260 阅读 · 0 评论 -
vue之作用域插槽和具名插槽slot、scope
、、、、、、、、、、、仅对以前所学做复习记录使用、、、、、、、、、因为在子组件中是不能写入数据和样式的,所以得用到插槽了。作用域插槽类似于将子组件的信息发给父组件。例如 school组件发给app组件数据1、school组件中写法要在父组件中展示info信息,在插槽中绑定随意名字属性<slot :xuexiaoInfo="info"></slot> xuexiaoInfo可以是任意名字,自己好记就行2、在app组件中接收1.一定要写在template中,原创 2022-08-16 17:19:57 · 462 阅读 · 1 评论 -
vue之vue-router
vue2只能安装是vue-router 3.0以上,否则报错。vue3只能安装vue-router 4.0以上。## 标题三、在main.js中导入和注册四、当进入默认“/”主页面或者页面不存在时,在第二步文件中进行重定向。App.vue中是展示所有的一级路由、一级路由;二级路由在一级路由的组件中显示,都需要写上router-view当路由是一级路由根路径 ‘ / ’时,vue会自动帮我们找到App.vue组件进行挂载渲染 ,所以是根路径时,显示的是app.vue组件。app.vue组件上有原创 2022-07-06 14:20:10 · 297 阅读 · 0 评论 -
vue之路由配置中的meta
、、、、、、、、、、、仅对以前所学做复习记录使用、、、、、、、、、meta数据的元数据,也就是程序员可以自己自定义的一些变量。原创 2022-07-01 10:22:22 · 464 阅读 · 0 评论 -
vue之native
当你在父组件中的子组件上绑定一个vue原生事件,如果不加上.native,事件是不生效的。native是必须要加在根组件上的,如果加在普通HTML标签上是不生效的。子组件:<div > <button type="button">我是按钮</button></div>父组件:<template> <div > <div class="blue" @click="outer(1)"></div>原创 2022-05-12 17:26:35 · 641 阅读 · 0 评论 -
vue之$event事件
vue中的$event相当于dom中的event,vue中当函数没有参数时,默认自带 $event事件。HTML:<i class="el-icon-delete" @click="delsku"></i>script:delsku(e){ console.log(e); },当在input中$event表示的是输入值,例如:<div v-for="(ite,inde) in item.list"> <el-input :value原创 2022-04-30 13:54:39 · 3554 阅读 · 0 评论 -
vue之Module not found: Error: Can‘t resolve ‘vuex‘ in ‘C:\Users\123\Desktop\vue项
Module not found: Error: Can’t resolve ‘vuex’ in 'C:\Users\123\Desktop\vue项1、路径写错了2、没有安装vuex3、安装不上vuex,版本太高了,vue2安装vuex3,vue3安装vuex4npm i vuex@3npm i vuex@4原创 2022-04-29 14:00:39 · 8310 阅读 · 0 评论 -
vue之解决跨域问题
同源策略:http协议、主机名、端口号都要相同。因为浏览器同源策略的影响,向后端服务器请求数据的时候,不能进行访问。可以采用代理服务器的方式,代理服务器:浏览器向一个相同同源策略的g代理服务器上请求资源,因为服务器之间没有同源策略,代理服务器就去找后端服务器请求资源,在返回给浏览器解决方法一:在根目录下新建vue.config.js文件,这里是js文件哈。module.exports = { lintOnSave:false, // 取消格式化 devServer:{ proxy:原创 2022-03-29 11:46:33 · 7864 阅读 · 0 评论 -
vue之组件的激活activated与失活deactivated
、、、、、、、、、、、仅对以前所学做复习记录使用、、、、、、、、、组件的激活activated与失活deactivated只有与keepalive一起使用才有效。当跳入页面就会激活,当跳出页面就会失活。student组件:显示页面school组件当从school页面跳转到student页面。再从student跳出到school页面尤其是当stu组件中使用beforeDestroy清除定时器时,由于stu组件已经缓存,不会被销毁,所以一直在后台执行定时器。...原创 2022-02-23 11:27:57 · 2992 阅读 · 0 评论 -
vue之路由中query和params
、、、、、、、、、、、仅对以前所学做复习记录使用、、、、、、、、、query:是以?问号的形式向跳转的页面传送参数,在要跳转到的页面地址栏显示用routerlink时,直接写在to里面,例如<router-link :to="{ // 用两个点属性写法 path: '/student/child', query: { oprice } // 不用引号,对象的形式 }" > 跳到child </router-link>第二种写法原创 2022-02-21 20:48:54 · 671 阅读 · 0 评论 -
vue之vuex
vuex状态管理;相当于一个共享数据;其中的一个数据的更改其他数据也是更改的。所谓的状态就是数据:状态 = 数据vuex里面有actions、mutations、state、getters、module几个对象组成。这几个对象统一归store管理。vm和vc上都有$tore并且整个项目仅有这一个store。vuex运行原理:组件派发任务到actions,actions触发mutations中的方法,然后mutations来改变state中的数据,数据变更后触发组件的更新渲染。也可以跳过action原创 2022-02-18 18:48:58 · 748 阅读 · 0 评论 -
vue之全局事件总线$bus
、、、、、、、、、、、仅对以前所学做复习记录使用、、、、、、、、、全局事件总线是组件间的一种通信方式,适用于任意组件间通信。主要原理是根据VueComponent.prototype.__ proto__ = Vue.prototype来进行全局应用。1、安装事件总线在vue实例中写入beforeCreate beforeCreate(){ Vue.prototype.$bus = this }其中的bus是个约定俗成的名字,你也可以起其他名字。this指向vue实例。共有两原创 2022-02-16 15:47:07 · 2425 阅读 · 0 评论 -
vue之scoped样式
、、、、、、、、、、、仅对以前所学做复习记录使用、、、、、、、、、1、定义组件样式当两个组件用了同一名字的样式,例如例子中的bg,且又在app页面展示,本来红色背景的应该显示红色,但都显示绿色。因为导入的时候先是school组件后是student组件,后面的覆盖前面的样式,所以页面都显示的绿色。解决办法:在style中加scoped,表示样式只在本页面有效。2、定义全局样式定义全局样式是所有文件共有的,只要在app.vue组件中定义就好了。可以拿到任何地方使用。<div id=原创 2022-02-14 14:50:15 · 500 阅读 · 0 评论 -
vue之mixin混入
功能:把多个组件公用的函数、钩子函数等提取成一个对象,相当于一个共用对象。定义混入文件,是js文件,例如mixin.js,名字随意起,一般用mixin.js它可以包含我们组件script项中的任意功能选项,如data、components、methods 、created、computed等等export default { mounted(){ console.log(1111); }, methods:{ add(){ this.n++ } } }1、在子组件中原创 2022-02-14 10:06:33 · 861 阅读 · 0 评论 -
vue之key的原理与作用
key不会显示在真是dom中,它是vue底层使用的,相当于一个身份证,是唯一的。当使用index时key会根据索引的变化而变化,1、数据会生成虚拟dom,并会给每天数据自动加一个key值,如果不写:key=“index”,则虚拟dom也会自动加上key值。2、将虚拟dom转换为真实dom3、当在数据头部增加一条数据时,新数据重新生成虚拟dom4、旧虚拟dom和新虚拟dom就会根据key值进行一对一比较5、例如旧虚拟dom:key=0和新虚拟dom:key=0进行比较;发现不同的地方就进行修改,原创 2022-02-12 14:09:00 · 336 阅读 · 0 评论 -
vue之v-cloak指令
当vue.js文件还没加载完成时,页面没法解析就会显示模板语法:而且此时元素后台还有v-cloak,直到文件加载完成拿到数据时消失如果加上v-cloak指令,就会不渲染,等到vue.js文件加载完成有数据时就会显示正常。等vue.js文件加载完成拿到数据此时的系统会在后台自动删除v-cloak;小结:v-cloak配合css解决因为网速慢,出现模板语法的情况;数据加载完成时,后台会自动删除v-cloak...原创 2022-02-08 15:15:52 · 461 阅读 · 0 评论 -
vue之监测对象数据的原理和监测数组数据的原理
1、data中的数据,在vue底层会有一个观察者observe对象监测,观察者通过Object.defineProperty进行data对象数据劫持// 这是一个简易版的观察者,只能处理根数据,不能处理数据中的数据;例如:let data = { person:{name:‘wyy’} arr:[ ]}// 观察者function Observe(obj) { // 先取出data中的所有键 let keys = Object.keys(obj) // 然后进行原创 2022-01-22 18:16:24 · 799 阅读 · 0 评论 -
vue之绑定class
class与v-bind:class两个一起使用一共有三种写法:字符串写法;数组写法;对象写法; <body> <div id="app"> <div class="bg" > <h1 :class="txt">字符串写法</h1> <h1 :class="txtArr">数组写法</h1> <h1 :class="objClass">对象写法</h1>原创 2022-01-22 18:12:08 · 476 阅读 · 0 评论 -
vue之MVC与MVVM区别
MVC:M-model-模型:数据处理(数据库、接口)V-view-视图:用户界面、页面(HTML编写的)C-control-控制器:编写js业务逻辑例如:从页面view层触发一个按钮获取数据,就会向C控制器层请求自己需要的数据,而C控制器就会向M模型层请求 数据,M模型层就会把数据传给C,C再传给V视图层。MVVM:M-model-模型:后端数据处理(数据库、接口)V-view-视图:用户界面、页面(HTML编写的)VM-viewModel-视图模型层:链接view和model的桥梁,v原创 2022-01-18 16:41:06 · 525 阅读 · 0 评论 -
vue之v-if与v-show的区别和应用作用
、、、、、、、、、、、仅对以前所学做复习记录使用、、、、、、、、、v-if:1.每次都需要重新删除或创建元素,即:dom元素不在后台页面中;2.有较高的切换性能消耗,因为你来回的不停切换,就是不停的来回删除和重建元素,性能消耗大3.与v-for一起使用,v-for的优先级高于v-if(不推荐一起用)v-show:1.每次都不需要重新删除或创建元素,因为元素一直留在页面中;不管条件是真是假,都在后台页面中存着,只是显示不显示的问题2.有较高的初始渲染消耗,因为它的元素一直留在页面中,初始渲染的时原创 2021-12-11 11:07:14 · 429 阅读 · 0 评论