zoukankan      html  css  js  c++  java
  • Electron-Vue项目使用Element的el-table组件不显示

    一、前言
    最近我把项目进行了整体重构,将原先的vue和electron分为两个工程文件夹的形式融合为了一个electron-vue工程文件,因为有很大的改动,特别是环境和相关配置方面与原先的工程有很大的不同,随之而来就有很多坑,这篇文章要将的就是今天碰到的element-UI一个组件重构前显示OK但重构之后显示不OK的问题,详情请继续阅读。

    二、问题描述
    在vue组件中,使用了Element的el-table组件,当重构了之后发现这个组件在相应页面不显示(高度为零),数据什么正常,语法OK,各种路径也OK,控制台也没报错,我花了一个上午找原因…

    三、问题解析
    在重构之后(electron-vue融合流),项目根目录文件夹下有一个.electron-vue文件夹,下边放着几个js配置文件(我的项目是6个js文件),具体的每个js配置文件详情请参考electron官网描述(中文的,哈哈)。
    另外我也浏览了Google,发现原来在vue中直接引入element的方式已经不能满足融合流的要求啦。
    请打开.electron-vue文件夹下的webpack.renderer.config.js配置文件,你会找到这样一行代码,竟然需要添加白名单!对的,你没看错(不明白什么是白名单的,请自行去问度娘):

    那么,vue都需要这样做,是不是element-ui也学要同样的操作才能正常使用呢,嘿嘿,答对了,So…

    四、问题解决(附上代码)
    只需要将element-ui也添加进白名单就可以啦!

    // 将vue模块列为白名单
    let whiteListedModules = ['vue', 'element-ui']
    1
    2
    然后重新运行项目,再进相应页面就会发现万恶的el-table组件不显示的问题已经完美解决。

  • 相关阅读:
    Encountered a section with no Package: header
    java的System.getProperty()方法能够获取的值
    谷歌技术"三宝"之MapReduce
    surfaceDestroyed什么时候被调用
    调用CachedRowSetImpl类时,为什么会出现这样的错误
    正則表達式举例(下)
    java中接口的定义与实现
    UVA 538
    编程算法
    3D空间包围球(Bounding Sphere)的求法
  • 原文地址:https://www.cnblogs.com/onesea/p/15419990.html
Copyright © 2011-2022 走看看