怎么解决iview中tooltip文字显示不下的问题

原创
小哥 3年前 (2022-10-20) 阅读数 59 #Web前端
文章标签 iview

方法一


    
    
A balloon appears when the mouse passes over this text

方法二

render: (h, params) => {
            let texts = ; //表列显示文本
            if (params.row.content !== null) {
              if (params.row.content.length > 6) { //[Intercept]列中显示的字数
                texts = params.row.content.substring(0, 6) + ".....";
              } else {
                texts = params.row.content;
              }
            }
            return h(div, [
              h(Tooltip, {
                props: {
                  placement: bottom,
                  // transfer: true  //是否将子弹层放置在 body 内
                },
                style: {
                  cursor: pointer,
                }
              }, [ //这个括号表示它是Tooltip标签的子标签
                texts, //表列显示文本
                h(div, {
                    slot: content,
                    style: {
                      whiteSpace: normal
                    }
                  }, params.row.content //整个信息就是泡泡里的文字。
                )
              ])
            ]);
          }
版权声明

所有资源都来源于爬虫采集,如有侵权请联系我们,我们将立即删除

热门