![](https://img-blog.csdnimg.cn/20201014180756927.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
vue精选
lt要努力
这个作者很懒,什么都没留下…
展开
-
vue3 template编译出来了的,并且出现了#document-fragment,里面的内容显示不出来解决方法
原因猜想:template也是一个html标签,可能为了区分原始的标签和vue的模板吧!3. 解决方法: 在vue3 template编译出来了的,并且出现了#document-fragment,里面的内容显示不出来解决方法template标签上加一个 v-if=“true”现在依然是在页面中没有显现出来,dom元素都没有存在。2. 往div里面再加点内容看看。原创 2023-02-01 10:45:55 · 1910 阅读 · 1 评论 -
inject 接收不到 provide 中的值
一、question???1. provide传值这个 layoutModel 在data中默认值是1,然后通过接口请求,改变它的值2. inject接收值此时父组件的值为3,但是inject接收到的值为1二、Why因为是接口请求更新数据,但provide在初始的时候就传了一个固定的初始值下去,所以下级组件接收到的是初始值,而不是更新后的值三、Answer在data定义的时候采用对象的形式,这样就是传一个地址过去 而不是一个固定的值...原创 2021-03-18 16:44:25 · 2827 阅读 · 1 评论 -
el-table动态合并表格,合并的表格行数是个变量--span-method
根据自己设定的规则,合并动态行数线上例子(可动态点击):https://codepen.io/luoting249/pen/QWKKZPp下面是代码片段(可把代码粘贴到element在线运行上,可看到效果):<script src="//unpkg.com/vue/dist/vue.js"></script><script src="//unpkg.com/element-ui@2.14.1/lib/index.js"></script><d原创 2020-12-10 10:06:31 · 283 阅读 · 1 评论 -
vue 双向绑定问题$emit无效
父组件变量传给子组件,子组件$emit 触发父组件的方法修改父组件的变量,但是父组件的值变了,子组件的值没有改变父组件:<div> // 子组件 <son :status.sync="status"/></div><script>export default { data(){ return{ status:false } }}</script>子组件:<div @click="change">原创 2020-11-09 19:40:17 · 3537 阅读 · 0 评论 -
使用 i18n Ally不生效
把 i18n Ally 的版本号变低点就好了为什么要使用 i18n Ally可以在元素中显示对应的国际化语言,方便开发如下图原创 2020-10-14 17:15:33 · 2970 阅读 · 3 评论 -
el-time-select数据改变了视图没更新
<el-form-item :label="$t('notificationPush.pushTime')" prop="pushTime" :rules="{required:true, validator:validator_pushTime, trigger: 'change'}"> <span class="date-label">{{$t('label.everyDay')}}</span> <el-time-select原创 2020-09-30 15:41:35 · 1927 阅读 · 3 评论 -
vue 监听对象,监听不到发生改变问题
这是我的监听computed: { ...mapGetters([ 'checkList' ]) },watch: { 'checkList': { handler: function (val) { if (this.checkList.salesGroup) { console.log(1) this.memberNum = this.checkList.salesGroup.length }, deep: tr原创 2020-09-09 17:36:18 · 1294 阅读 · 0 评论 -
Vue.directive 自定义指令的使用
一个组件可能因为层级关系,无法快速显示,这时候就可将一个组件放置body中// append-to-body.jsexport default { inserted: function (el, { value = true }) { if (!value) { return } document.body.appendChild(el) }, unbind (el) { // document.body.removeChild(el) }}原创 2020-08-31 16:54:09 · 257 阅读 · 0 评论 -
vue 菜单权限
src/router/index.jsimport Vue from 'vue'import Router from 'vue-router'import store from '../store'import NProgress from 'nprogress'import 'nprogress/nprogress.css'import { getToken } from '@/utils/auth'import getPageTitle from '@/utils/get-page-tit原创 2020-08-26 10:16:00 · 497 阅读 · 2 评论 -
vue项目中,使用bus总线后请求叠加问题
使用bus总线后,发现自己接口请求叠加然后之后发现自己定义和使用了bus总线,但是都没有off掉一般地,在$on前$off掉,在beforeDestory或者destoryed也要$off掉 mounted () { BusVue.$off('isShowBox') BusVue.$on('isShowBox', this.isShowBox) }, beforeDestroy () { BusVue.$off('isShowBox') },...原创 2020-08-06 19:31:05 · 263 阅读 · 0 评论 -
ElementUI el-upload上传文件
在结构中使用 el-upload<el-upload class="avatar-uploader" action="" :http-request="uploadHttp" :show-file-list="false"> <el-button type="primary" size="small">上传文件</el-button></el-upload>在 script 标签中import { postFileUpload } from '原创 2020-07-27 19:25:40 · 566 阅读 · 0 评论 -
在vue中,想要改变自己新增的一个属性值,但数据改变了,视图没有发生改变
举个常见的栗子:展开和关闭。在数据请求到数据后,新增展开和关闭的一个开关属性 flag我的数据结构:obj:{ arr:[ { id: 1, content:'' },{ id: 2, content:'' } ]}<span class="pointer" v-if="item.flag" @click="switchOpen(item, false)">收起评论</span><span class="pointer" v-原创 2020-05-27 18:31:55 · 642 阅读 · 0 评论 -
图片由模糊变清晰的效果实现
首先 要获取模糊图和清晰图在蓝湖上:模糊图-标准点一倍图、清晰图-高清视网膜三倍图<img id="btn3" :src="require('@/assets/images/landing/btn3-s.png')" @click="postRegister"><img id="plat" class="mt55 img-box" width="100%" :src="require('@/assets/images/landing/plat-s.png')"><img原创 2020-05-14 10:38:00 · 1638 阅读 · 0 评论 -
给数组里的对象中的数组每一项添加一个属性,属性值为发送请求过后的值
这样的一个需求,下面export const productObj = [ { img: 'img1', data: [ { id: 1, text: '1' }, { id: 2, text: '2' }, { id: 3, text: '3'...原创 2020-04-30 17:44:34 · 3677 阅读 · 1 评论 -
vue项目中,新增或编辑后返回列表页,数据不刷新问题
场景:新增编辑页是列表页的二级路由在新增或编辑后列表页不刷新相应的数据在父路由中:加一个@refresh="getKnowledgeList",自定义方法,传到子路由上,其中绑定的方法为获取列表页的数据方法<template> <router-view v-if="hidden" :key="key" @refresh="getKnowledgeList">&l...原创 2020-03-06 17:34:11 · 3144 阅读 · 0 评论 -
当图片路径不能加载出图片时,想用一张占位图做显示,应该怎么办
img标签中的src图片加载失败,原来的图片位置会出现一个碎片图标如何使用占位图,变成这样这时候应该了解一下 img 标签的onerror事件:onerror 事件会在文档或图像加载过程中发生错误时被触发。示例代码结构中:<img width='100%' :src="imgs" alt="picture" :onerror="errorImg">vue项目中...原创 2020-02-05 12:43:20 · 1305 阅读 · 1 评论 -
vue项目中使用screenfull.js实现全屏功能
安装screenfull.js插件(在npm官网上有)npm install screenfull --save 在vue项目中 src/components/ScreenFull/index.vue(写成公共组件)<template> <el-tooltip effect="dark" content="全屏" placement="bottom">...原创 2019-12-27 17:05:23 · 829 阅读 · 0 评论 -
vue项目中使用vue-directive-image-previewer插件进行图片放大处理
安装vue-directive-image-previewer插件npm install vue-directive-image-previewer --save在vue项目中的main.js中引入并注册import VueDirectiveImagePreviewer from 'vue-directive-image-previewer'import 'vue-directi...原创 2019-12-27 16:20:34 · 4264 阅读 · 0 评论