vue的那些事
jieyucx
这个作者很懒,什么都没留下…
展开
-
vue3中使用useStore()获取vux中的store踩坑记录
是否在setup函数下,不可以在setup里的函数的内部,写在函数内部的话就会出现,获取不到store对象的情况,useStore这个方法的调用位置是有要求的,它只能在setup函数中调用,这是它的语法规定。,在下面打印‘store’时,组件会被渲染两次,打印两次,第一次可以打印出来值, 第二次是个。如上述代码,我在setup中的计算属性函数中嵌套使用了。放到setup中定义就可以了。原创 2024-04-25 11:41:57 · 211 阅读 · 1 评论 -
vue-echarts踩坑,本地开发可以渲染echarts图表,线上环境图表渲染不出来
如上图,我开始写的静态数据,在data中定义了chartOption1:{…}, 在接口数据返回之后,更新了配置项,在本地开发环境可以正常渲染。但是线上环境出不来,也不报错,接口数据一切正常。无奈最后没有使用‘vue-echarts’这个库,用了echarts原生写法。在接口获取数据以后,调用inintEcharts方法。全局注册v-chart组件。原创 2024-01-12 12:11:48 · 694 阅读 · 0 评论 -
高德地图vue-amap实现区域掩膜卫星图且背景为灰色
vue-amap高德1.4.4,区域掩膜效果。//利用行政区查询获取边界构建mask路径。//也可以直接通过经纬度构建mask路径。// 设置地图中心点为北京。原创 2024-01-09 09:13:51 · 1427 阅读 · 0 评论 -
elementUI 框架中el-radio-group组件赋值之后,点击无效问题
在绑定值变化触发的事件添加 this.$forceUpdate() 强制更新。原创 2023-12-14 18:05:02 · 1757 阅读 · 0 评论 -
vue笔记2(虚拟dom)
Vue中虚拟DOM的实现原理是通过使用JavaScript对象来描述真实的DOM树结构,并通过对比新旧虚拟DOM树的差异,最小化地更新真实DOM。使用虚拟DOM的原因有以下几点:提高性能:真实DOM的更新是非常消耗性能的操作,而虚拟DOM可以通过批量处理和优化算法,将多次的DOM操作合并为一次,从而提高性能。简化操作:通过使用虚拟DOM,开发者不再需要手动操作真实DOM,只需要操作虚拟DOM,减少了开发的复杂度和出错的可能性。原创 2023-11-30 11:33:11 · 760 阅读 · 0 评论 -
vue2的响应式数据变化
Vue实现响应式变化的方式是通过数据劫持和发布-订阅模式。Vue通过使用方法对数据对象的属性进行劫持,使其能够在属性值发生变化时触发相应的操作。Vue使用发布-订阅模式来监听数据变化,并在变化时通知相关的订阅者更新视图。当数据发生变化时,会触发相应的setter方法,然后通知所有订阅者进行更新。具体实现步骤如下:在初始化Vue实例时,通过遍历数据对象,利用方法将每个属性转化为getter和setter。在getter方法中,将订阅者Watcher对象添加到当前属性的依赖列表中。在setter。原创 2023-11-21 16:19:13 · 476 阅读 · 0 评论 -
谈谈你对mvc和mvvm的理解
MVC和MVVM是软件开发中两种常见的架构模式,各自有不同的优缺点。MVC)是一种经典的架构模式,将应用程序分为三个部分:模型(Model)、视图(View)和控制器(Controller模型负责处理数据逻辑,视图负责展示数据,控制器负责协调模型和视图之间的交互。MVC模式的优点是结构清晰,分工明确,易于维护和测试。但是,MVC模式在大型应用中很容易导致代码复杂和耦合性增加。MVVM)是一种相对较新的架构模式,它采用了数据绑定和命令绑定的方式来实现视图与数据的自动同步。MVVM。原创 2023-11-21 10:53:01 · 329 阅读 · 0 评论 -
vue中的provide/inject依赖注入深层数据传递
的使用方法依旧相同,但是有一个重要的改变。在 Vue 3 中,使用。接收到这个数据,并能够改变它。值也会随之变化,即实现了响应式的数据传递。是一对用于父组件向子组件传递数据的选项。传递过来的数据,实现跨层级组件间的通信。属性可以接收父组件通过。能够实现响应式传递数据。在上述示例中,父组件通过。在 Vue 2 中,在 Vue 3 中,原创 2023-10-31 15:46:29 · 306 阅读 · 0 评论 -
vue项目使用vue-video-player实现视频直播功能
因为设置后,Access-Control-Allow-Origin 头信息就不能设置为 *,而且响应头信息需要添加 Access-Control-Allow-Credentials 头信息,并将其设置为 true。可以在该事件中执行一些播放结束相关的操作,比如显示重新播放按钮、跳转到下一个视频等。可以在该事件中执行一些初始化的操作,比如设置视频源、设置音量等。可以在该事件中执行一些播放相关的操作,比如显示暂停按钮、更新播放进度等。可以在该事件中执行一些暂停相关的操作,比如显示播放按钮、暂停播放进度等。原创 2023-09-19 17:11:39 · 7909 阅读 · 2 评论 -
vue2中的mixin
混入(`Mixin`)是 `Vue.js` 中用于**复用部分组件逻辑的一种技术**。通过混入,你可以将组件的方法,生命周期钩子,甚至 data 都进行复用。原创 2023-07-10 09:03:38 · 2414 阅读 · 0 评论 -
vue项目 ‘npm run dev‘ 报错 npm ERR! errno 134
这时需要我们分配更多的内存给。原创 2023-06-27 15:29:56 · 3373 阅读 · 1 评论 -
vue路由在使用keep-alive缓存之后第二次进入页面created和mounted不执行问题及解决
Vue.js中keep-alive是一个内置组件,可以在需要缓存的组件上添加keep-alive标签,使得这个组件被缓存起来,不会被多次渲染和销毁。keep-alive组件有两个独立的生命周期钩子,分别是activated和。原创 2023-06-14 09:10:18 · 6343 阅读 · 0 评论 -
vue中如何保留字符串中的空格
直接将后端返回的字符串渲染到页面时, 它会。就是你要渲染的带有空格的字符串。有的时候的一些需求是需要你。后端返回的字符串中的。原创 2023-06-05 10:09:18 · 749 阅读 · 0 评论 -
运行vue项目时报错defineConfig is not a function
然后一直yes,也就是敲回车,一直等他跑完就行了。项目根目录下运行如下命令。原创 2023-06-01 16:14:12 · 4239 阅读 · 2 评论 -
vue编程式导航params传参踩坑记录
【代码】vue编程式导航params传参踩坑记录。原创 2023-05-25 11:47:19 · 109 阅读 · 0 评论 -
vue中使用高德地图实现懒加载标记点覆盖物
地图懒加载标记点是一种技术,用于在保证网页加载速度的前提下,实现地图标记点的渲染和呈现。通常地图标记点会在元素加载完毕后立刻渲染出来,如果标记点过多或者标记点所在的地图数据包过大,则会导致网页加载速度缓慢。而通过地图懒加载标记点技术,可以让标记点在用户需要查看地图时再被渲染,以减少页面加载时间和提高页面性能。该技术通过前端JavaScript控制地图事件和数据,使得只有当标记点所在的地图区域被用户浏览时,标记点才被渲染出来。同时,原创 2023-05-25 11:15:43 · 1009 阅读 · 1 评论 -
什么是跨域,如何解决跨域(前后端)
跨域:指的是在网页端,发起一个跨越不同域名(协议、端口号)的HTTP请求的过程。例如:当一个页面的URL为http://a.com,通过Ajax向http://b.com发送请求,就是一个跨域请求。跨域问题是由浏览器的同源策略所引起的。同源策略限制了JS代码只能读取与其来源页面具有相同域名的数据。具体而言,同源策略是一种浏览器安全策略,它通过检查来源URL(协议 + 域名 +端口)是否与目标URL来源是否相同来决定是否允许跨域访问。同源策略主要限制以下四种行为。原创 2023-05-12 09:52:24 · 3167 阅读 · 0 评论 -
vue中使用高德地图实现历史轨迹回放并能控制播放轨迹的倍速
如何在vue中引入高德地图在这里就不过多赘述,大家可以看这篇参考。原创 2023-05-11 08:56:43 · 2782 阅读 · 2 评论 -
高德地图显示影藏交通图层
【代码】高德地图显示影藏交通图层。原创 2023-05-09 15:10:40 · 248 阅读 · 0 评论 -
在vue中引入高德地图
这两点在这篇文章就不过多赘述,有需要的小伙伴可以查查资料,或者去高德地图api官网都有很详细的介绍。简单提一下申请秘钥流程(web端)好啦!步入正题,在vue项目中引入高德地图。原创 2023-05-09 09:31:01 · 1490 阅读 · 0 评论 -
解决element-ui中Tab切换vchart/echarts不显示问题
el-tab-pane label=“累计客户” name=“second” lazy>测试第一栏Tab中的echarts显示,第二栏使用了click点击加载,请求了数据但是dom没有更新.还有一些其他的情况,我这里是使用这个lazy属性就解决,具体可参考这位大佬的。第一个tab中的echarts正常显示,第二个样式丢失了。延时加载,默认是false,这里添加为true即可。使用element-ui中tab自带属性。原创 2023-05-08 16:34:42 · 850 阅读 · 1 评论 -
vue页面内嵌iframe使用postMessage进行数据交互(postMessage跨域通信)
是html5引入的API,它允许来自不同源的脚本采用异步方式进行有效的通信,可以实现跨文本文档,多窗口,跨域消息传递.多用于窗口间数据通信,这也使它成为跨域通信的一种有效的解决方案.原创 2023-04-25 17:13:45 · 4902 阅读 · 0 评论 -
vue2中实现一个悬浮球点击可以展开/收取,可拖拽到页面的任何位置。
我开始想的是用vue中给我们提供的过度组件实现,由于自己是菜鸡不熟悉这块东西,懒得看文档了,就自己写了个动画函数,用dom操作实现了动画,具体代码如下。这个主要是参考这位大佬的,写的非常好,我是直接拿来就用了。主要就是设置盒子阴影,主要代码如下。如下:感兴趣的朋友可以试试。原创 2023-04-23 10:16:55 · 2250 阅读 · 2 评论 -
vue2中报错:please transfer a valid prop path to form item!
vue2中报错:please transfer a valid prop path to form item!将两者统一就可以了,比如都绑定为des。这是因为form表单的某一项。原创 2023-04-06 14:56:43 · 2524 阅读 · 0 评论 -
Computed property was assigned to but it has no setter问题解决
报这个是因为在computed中定义了某个属性,只有一个return额,而你在其他地方又对这个属性赋值了就会报这个,比如这样。原创 2023-03-31 14:53:30 · 4307 阅读 · 0 评论 -
在vue2中使用echarts,vue-echarts,v-charts
可以看到使用 组件了之后可以省去那些繁琐的获取。注册组件之后我们全局都可以直接使用组件了。同样的安装导入,v-charts同样依赖echarts。的原型上,这样我们在全局都可以通过。钩子中写逻辑代码,具体步骤如下,步骤差不多,只不过我们需要在。准备工作做好了,咱们看个例子。绘制如图所示的一个示例图。代码只是圈住的图的部分。原创 2023-03-28 09:22:36 · 5193 阅读 · 0 评论 -
vue跳转外部链接的方法
vue跳转外部链接的方法原创 2023-03-22 15:06:17 · 11667 阅读 · 0 评论 -
vue2清空数组了 但是视图没有更新
vue2清空数组了 但是视图没有更新原创 2023-03-20 12:32:22 · 1840 阅读 · 0 评论 -
[es6] 模板字符串内添加if判断
模板字符串内添加if判断原创 2023-03-20 12:22:21 · 1170 阅读 · 0 评论 -
踩坑修改el-input样式
踩坑修改el-input样式原创 2023-03-01 12:21:02 · 362 阅读 · 0 评论 -
vue : 无法加载文件 C:\Users\Administrator\AppData\Roaming\npm\vue.ps1,因为在此系统上禁止运行脚本。有关详细信息,
vue : 无法加载文件 C:\Users\Administrator\AppData\Roaming\npm\vue.ps1,因为在此系统上禁止运行脚本。有关详细信息,原创 2023-03-01 09:05:51 · 109 阅读 · 0 评论 -
vue3 封装城市选择组件实现点击字母跳转到对应城市位置
vue3 封装城市选择组件实现点击字母跳转到对应城市位置原创 2023-01-04 14:32:53 · 572 阅读 · 0 评论 -
vue3 v-bind=“$attrs“ 继承组件全部属性
vue3 v-bind="$attrs" 继承组件全部属性原创 2023-01-02 15:24:26 · 4190 阅读 · 0 评论 -
vue3封装组件预留默认插槽,当插槽中有内容时显示插槽内容,没有时显示某个属性内容
vue3封装组件预留默认插槽,当插槽中有内容时显示插槽内容,没有时显示某个属性内容原创 2022-12-30 15:43:50 · 2450 阅读 · 0 评论 -
vue3全局注册组件
vue3全局注册组件原创 2022-12-29 12:03:57 · 3650 阅读 · 0 评论 -
vue3 el-upload文件上传隐藏文件列表
vue3 el-upload文件上传隐藏文件列表原创 2022-12-14 14:19:53 · 3854 阅读 · 1 评论 -
vite项目集成Windi Css
vite项目集成Windi Css原创 2022-12-09 09:49:44 · 628 阅读 · 0 评论 -
vue3中引入element-plus
vue3中引入element-plus原创 2022-12-08 15:57:53 · 205 阅读 · 0 评论 -
vite 创建vue3项目
vite 创建vue3项目原创 2022-12-08 15:50:07 · 104 阅读 · 0 评论 -
HbuilderX运行uni-app开发的微信小程序
HbuilderX运行uni-app开发的微信小程序原创 2022-12-08 11:48:59 · 3151 阅读 · 0 评论