Vue/iView中Table表格组件的Columns使用render渲染出来的组件，不但可以render一个Button，还可以使用其他html的组件，绑定事件，可以使用on: {click}来实现，如下render一个Icon实现绑定单击事件： columns: [ { title: '删除', key: "action", fixed: 'left', minWidth: 144, render: (h, params) => { return h("Icon", { props: { type: 'm…

iView中用到一个this.$Modal.confirm对话框，确认后再执行确定动作后，弹出this.$Modal.info对话框告诉用户执行结果，结果是第二个info对话框闪了以下就消失了； debug发现，如果confirm后，执行的动作花的时间长一点的话，第二个info对话框就能显示了！估计是这里的Modal采用的隐藏开关用的同一个变量，第一个消失的时候，导致第二个也跟着消失了。 既然执行的动作花的时间长一点就能解决，也就是说只要给第一个对话框足够的时间让它消失，再执行下一步的动作就可以了，我们可以在第一个…

最近在使用iview做项目的时候，遇到一个需求，就是在使用Tabs 标签页的时候，面板TabPane的数量是动态的，但是如果遇到Tabs只有一个的时候，就隐藏掉Tab的标签。虽然官方的API没有现成的实现，但是通过自定义的css，可以做到。 准备好隐藏和显示tab标签的css： /*一个TabPane都时候，把tab隐藏*/ .my-tabs-hidden .ivu-tabs-bar{ display: none; } .my-tabs-block .ivu-tabs-bar{ display: block; } …

有个项目的UI开发框架用的iView，不过在Vue框架下，富文本编辑器功能全面的不多，后来找到了百度的ueditor，github页面：https://github.com/fex-team/ueditor 功能确实比较丰富，有图片、文档的上传和整理，不过原生没有在vue下的适配，好在github上有开发者已经做了适配，可以采用v-model来绑定编辑器的内容，这个就很vue了，详见：https://github.com/HaoChuan9421/vue-ueditor-wrap 这篇文章不做详细介绍如何使用，gi…

最近项目中遇到一个列较多的表格，需要里面的内容根据屏幕宽度自适应，每一列最多显示2行（有些情况下最多显示一行），超出的部分用...，并且鼠标移上去用ToolTip显示全部 如果是简单的单行显示不下就用...并且Tooltip提示，自带的就可以实现了： var columns = [ { title: '仪器型号', key: 'model', ellipsis: true,//超出用... tooltip: true,//鼠标移上去Tooltip提示 minWidth: 150 } ] 但是很多情况下没有这么简单，…