Vue.js
Vue使用过程中遇到的问题及解决方案。
hoaxxcj
主要从事前端网页开发。
展开
-
Vue项目中使用iframe和postMessage实现跨域通信传输数据
之前项目有个需求:想在父页面中嵌入的子iframe里用父页面的登录信息进行二次登录。当时采用iframe和postMessage实现了这一功能:1、父页面中的子iframe:2、父页面中使用contentWindow.postMessage方法向子iframe传入“username”和“password”两个参数:3、子页面中使用window.addEventListener方法监听获取父页面传过来的“username”和“password”两个参数:...原创 2021-10-24 21:21:44 · 1052 阅读 · 0 评论 -
装饰者模式(Decorator Pattern)在Vuex中的应用思考
装饰者模式又称装饰器模式,在不改变原对象的基础上,通过对其添加属性或方法来进行包装拓展,使得原有对象可以动态具有更多功能。Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。它采用集中式存储管理应用的所有组件的状态,并以相应的规则保证状态以一种可预测的方式发生变化。理解一:在Vuex中,单一状态树作为唯一数据源,Store对象相当于原对象。State、Getters、Mutations、Actions、Modules相当于这单一状态树的装饰器,通过这些装饰器来提供额外功能,如获取状态、.原创 2021-06-29 09:08:03 · 295 阅读 · 0 评论 -
Vue项目使用v-drag实现拖拽功能
无意间发现一年半前使用的拖拽功能,感觉挺实用的,分享给大伙。首先需要创建一个自定义指令“drag”;然后直接按照下图代码将dom元素的鼠标点击、拖动、松开事件方法定义好(这里的el是指令所绑定的元素,可以用来直接操作 DOM);最后在想要拖动的元素的根节点标签中加入“v-drag”即可,此时,自定义指令中的el就是类名为“contrast-con”的div元素。...原创 2021-04-27 09:39:00 · 10277 阅读 · 4 评论 -
Vue项目入口文件的两种写法
无意中翻出两年前学习Vue时做的总结,欢迎大伙指正。Vue有两种写法:1、main.js搭配App.vue;2、一个HTML搞定。第一种格式:main.js文件:import Vue from ’vue';import App from './App';Vue.config.productionTip = false;new Vue({el: '#app',template: '<App/>',components: { App }});A原创 2021-03-30 15:52:30 · 1742 阅读 · 0 评论