Vue
Mengqi_8816
这个作者很懒,什么都没留下…
展开
-
APP Vue项目如何实现多种背景主题或皮肤切换功能
需求:当App选择不同的皮肤,页面随之发生相应的换肤效果把需要更换的css样式提取出来,主要有:1、主色调:背景颜色,文本字体颜色2、logo、一些背景图3、一些操作按钮的颜色4、一些menu和小图片第一步:实现触发功能按钮...原创 2020-04-17 18:18:30 · 1851 阅读 · 1 评论 -
Vue 事件修饰符 如何解决/处理点击事件无法触发
在事件处理程序中调用 event.preventDefault() 或 event.stopPropagation() 是非常常见的需求。尽管我们可以在 methods 中轻松实现这点,但更好的方式是:methods 只有纯粹的数据逻辑,而不是去处理 DOM 事件细节。为了解决这个问题, Vue.js 为 v-on 提供了 事件修饰符。通过由点(.)表示的指令后缀来调用修饰符。常见的事件修饰符如...原创 2020-04-05 20:56:32 · 983 阅读 · 0 评论 -
Vue 监听路由变化
方法一:通过 watch1.1 监听,当路由发生变化的时候执行watch: { $route(to, from) { console.log(to.path); } },1.2 监听,当路由发生变化的时候执行watch: { $route: { handler: function(val, oldVal) { cons...原创 2020-01-02 10:04:40 · 2885 阅读 · 1 评论 -
Vue 如何在PC端官网调用接入百度地图
1.项目根目录下下载百度地图插件npm install vue-baidu-map –save2.在首页index.html中引入百度地图:我申请的密钥为 :3bVHdeo2ZZaZO4QczC63d0kMsbA55ZSD3.在显示地图的组件中 template 中: //地图的容器4.在显示地图的组件中 script 中:export default {name: ‘p...原创 2019-11-20 15:53:06 · 1204 阅读 · 1 评论 -
Vue 输入框新增搜索历史记录功能(本地存储)
vue实现搜索显示历史搜索记录,采用插件-good-storage安装插件 npm install good-storage -S在本地新建cache.js文件,该文件是关于本地存储的逻辑处理(缓存到本地的数据最大缓存15条,并且新的插入在第一位,首先得到当前的存储数据情况,将关键字存到数组中,判断如果数组中有相同的数据,则把重复的数据删除,将新的关键字存入到前面)c...原创 2019-10-14 11:48:17 · 2751 阅读 · 0 评论 -
插件的基本用法--Vue 的插件库
Vue.js 的插件应该暴露一个 install 方法。这个方法的第一个参数是 Vue 构造器,第二个参数是一个可选的选项对象:vue-myPlugin.js 自定义插件文件(function () {//需要向外暴露的插件对象const MyPlugin = {}//插件对象必须有一个 install()MyPlugin.install = function (Vue, option...原创 2019-07-22 19:28:12 · 164 阅读 · 0 评论 -
如何在vue.js渲染完界面之后调用函数
在使用vue.js框架的时候,有时候会希望在页面渲染完成之后,再执行函数方法来处理初始化相关的操作,如果只处理页面位置、获取dom元素的宽或者高时,必须要在页面完全渲染之后才可以,页面没有加载完成之前,会导致获取到的宽高或获取的宽高不准确。使用过jquery的都知道,有个ready方法可以使用,但vue.js则需要结合watch和nextTick方法或者利用vue的钩子函数使用new Vue({...原创 2019-08-09 10:16:02 · 1459 阅读 · 0 评论 -
Vue中获取高度的方法
一.Vue 中获取滚动条高度的方法<script type="text/Babel"> mounted() {//可以在这里面直接进行滚动条的获取 window.addEventListener('scroll', this.getTopHeight , true) } methods: { getTopHeight () { //方法...原创 2019-08-09 15:58:32 · 5635 阅读 · 0 评论 -
Vue点击时动态改变样式
1.vue点击时动态改变样式(静态页面写死)<template> <div> <!-- 流程角色 --> <div class="flow-role"> <div class="role-title title-style">流程角色</div> ...原创 2019-08-27 11:18:54 · 6107 阅读 · 0 评论