Vue2 - 随笔分类 - _xinT

Vue之使用umy-ui库的u-table解决 el-table当存在大量数据时，界面操作卡顿。

摘要：提示：一、下面的1. 对应二、下面的1.；2.则对应2. 错误排查：在使用中如果出现：readding 'style' undefined类似错误的, 可以先排查 u-table中height的值引起的。这里只以我这里出现的情况为基准作出此提示，仅供参考。提示：需根据具体需求使用相应表格。例如：阅读全文

posted @ 2022-03-18 13:27 _xinT 阅读(14537) 评论(0) 推荐(1)

Vue 使用Lodop进行标签（条码）打印

摘要：一、使用到的插件：vue-barcode（vue条形码插件），Lodop打印控件（我这里使用windows64版，所以以此进行举例说明。）。详述：前者（指vue-barcode）针对在前端界面上观察到的效果。使用： 1.安装：npm install @xkeshi/vue-barcode vue 阅读全文

posted @ 2021-11-16 16:54 _xinT 阅读(6205) 评论(0) 推荐(0)

Element--->>>最新骨架屏Skeleton使用

摘要：首先，Element在最近的一次更新中（时间：2021-06-29）新增了Skeleton骨架屏组件、Empty空状态组件。那么在使用其自带组件Skeleton时，应将按照如下步骤使用： Ⅰ：如果element不是最新版本的话，先进行卸载：npm uninstall element-ui Ⅱ：安阅读全文

posted @ 2021-07-13 15:53 _xinT 阅读(4953) 评论(0) 推荐(1)

element 侧边栏的卡顿问题

摘要：// 解决element侧边栏收缩时的卡顿情况（覆盖它默认的css） .horizontal-collapse-transition { transition: 0s width ease-in-out, 0s padding-left ease-in-out, 0s padding-right e 阅读全文

posted @ 2020-07-30 16:40 _xinT 阅读(2708) 评论(0) 推荐(0)

Vue 树形列表的全部展开与全部收起

摘要：1.先看table列表中的设置：（看列表中有下划线的那三个即可。另，expanRow 是个数组记得在data中别忘记了。） <el-table :data="TableData" ref="theTable" :default-expand-all="isExpandAll" :expand-ro 阅读全文

posted @ 2020-07-30 15:35 _xinT 阅读(5492) 评论(0) 推荐(0)

Vue watch监听 date中的变量与数组或者对象的数据变化

摘要：直接看下面代码： 1.红色的的为一个对象，watch监听时。需要借助 computed 属性，否则watch监听打印出来的新旧值看不出。（注：方法可以随便写，但是 computed 中与 watch的名字要一致，且computed中必须return返回值。） 2.蓝色的的为一个普通的变量，watc 阅读全文

posted @ 2020-06-16 19:35 _xinT 阅读(2709) 评论(0) 推荐(0)

Vue + Element table的@select方法获取当table中的id值都相同时，获取他们索引

摘要：先说下问题情况，原本通过双重forEach方法方法，遍历可以获取到被勾选中的索引。 let arr = []val.forEach((val, index) => { this.TableData.forEach((v,i) => { if(val.id v.id ) { arr.push(i); 阅读全文

posted @ 2020-06-11 21:31 _xinT 阅读(1797) 评论(0) 推荐(0)

Vue + Element table中的某行触发enter事件后，使该行disabled

摘要：废话不罗嗦，上硬菜。 1.html下: <el-table-column label="名称" sortable> <template slot-scope="scope"> <el-input v-model="scope.row.name" :disabled="Disabled[scope.$ 阅读全文

posted @ 2020-06-11 20:56 _xinT 阅读(1301) 评论(0) 推荐(0)

Vue + Element tree树形控件的懒加载使用

摘要：come on，Bro。直接上代码。先看效果： 1.界面中： 1 <el-tree 2 :data="treeData" 3 :props="defaultProps" 4 :load="loadNode" 5 @node-click="handleNodeClick" 6 lazy> 7 </e 阅读全文

posted @ 2020-06-06 18:27 _xinT 阅读(12494) 评论(0) 推荐(2)

Vue web使用LeapFTP 上传到服务器

摘要：1.下载LeapFTP（绿色破解版）（注意：如果上传不了或上传功能不能使用则有可能是版本问题，重新下载个其他版本的则没问题） 2.打开左上角的站点管理器 >>>点击站点 >>>新建 >>>给站点起个名字 3.输入要发布到的服务器地址、端口 4.匿名登录取消勾选 5.输入服务器的用户名、密码 6.点阅读全文

posted @ 2020-05-22 09:44 _xinT 阅读(979) 评论(0) 推荐(0)

21.Vue---npm run build 项目打包文件过大（体积优化）

摘要：在项目打包完成后，经常会遇到一些文件过大或者一些路径地址不对的问题从而导致项目加载缓慢以及一些图片加载不出来或者一些其他问题的产生。根据自己打包后遇到的一些问题在这里记录一下，以防下次遇到后还的麻烦性的查找，唉😔~~~，就是懒，哈哈。（注：本文呢我就写一些遇到的问题和一些解决的方法，具体的实现过阅读全文

posted @ 2019-11-02 11:07 _xinT 阅读(7418) 评论(0) 推荐(0)

20. Vue-cli项目使用less

摘要：记录下style的less方式的使用方法。 1.安装 less 和 less-loader : npm install less less-loader --save-dev 2.打开 build/webpack.base.conf.js ， module.exports = 的对象的 module 阅读全文

posted @ 2019-10-09 11:03 _xinT 阅读(956) 评论(0) 推荐(0)

19. Vue+i18n 实现多语言翻译

摘要：1. npm 安装 npm install vue-i18n 2.　src/assets文件夹下穿件文件夹i18n，然后再在i18n文件夹中创建langs文件夹和i18n.js文件，最后再在langs文件夹下创建相应语言文件，我这里是cn.js中文文件，en.js英文文件。如图所示（相应文件的阅读全文

posted @ 2019-09-26 17:50 _xinT 阅读(1637) 评论(0) 推荐(0)

18.Vue+Element UI的form表单规则验证国际化(多语言)

摘要：举例说明，先看看吧。整个过程呢，也就这两三步。到此就设置OK了。阅读全文

posted @ 2019-07-05 15:18 _xinT 阅读(5046) 评论(3) 推荐(1)

17. Vue+Element UI的国际语言插件i18n导致DatePicker日期控件英文错乱

摘要：先附上链接，详细请参考：https://blog.csdn.net/github_39532240/article/details/79192780 再来说说我的情况吧，因为项目需要语言的国际化所以就采用了Vue支持的i18n语言国际化，但是当使用了之后发现Element-ui组件的DatePick 阅读全文

posted @ 2019-07-01 18:21 _xinT 阅读(3612) 评论(1) 推荐(1)

16. Vue 登录存储

摘要：存储方法：第一种（Vuex）（PS：刷新就清空时使用或者使用eventBus全局变量也行。）第二种（sessionStorage）（PS：刷新不清空关闭窗口才清空时请用。）第三种（localStorage）（PS：关闭浏览器都不清空时才使用。）在此之前呢，先简单了解下他们的操作使用吧！ ses 阅读全文

posted @ 2019-06-29 18:28 _xinT 阅读(2311) 评论(0) 推荐(0)

14.Vue 定义全局函数

摘要：参考：https://blog.csdn.net/sinat_17775997/article/details/73942828 方法一：（建议全局函数较少的情况下使用） 1.在main.js中写入函数 2.在所需的组件中调用即可方法二：（建议全局函数较多的情况下使用） 1.创建一个自己所需的ba 阅读全文

posted @ 2019-06-15 14:37 _xinT 阅读(181) 评论(0) 推荐(0)

13.Vue+Element UI实现复制内容

摘要：1. 安装依赖包： npm install vue-clipboard2 --save 2. main.js中引入 import Vue from 'vue' import VueClipboard from 'vue-clipboard2' Vue.use( VueClipboard ) 3.页面阅读全文

posted @ 2019-06-14 17:26 _xinT 阅读(7829) 评论(0) 推荐(0)

12.Vue+Element UI 获取input的值

摘要：一、（表格内直接编辑并取值） HTML: <el-table> <el-table-column prop="time" label="日期" ></el-table-column> <el-table-column prop="name" label="名称" ></el-table-column 阅读全文

posted @ 2019-04-22 18:35 _xinT 阅读(16124) 评论(0) 推荐(0)

11.Vue安装Axios及使用

摘要：1.安装：npm install axios --save-dev 2.main.js中导入 import axios from 'axios'; /* 引入axios进行地址访问*/ Vue.prototype.$http = axios; （注意：不使用use来使用该例，而是用prototype 阅读全文

posted @ 2019-04-22 18:08 _xinT 阅读(24044) 评论(0) 推荐(0)

随笔分类 - Vue2