vue的:title如何换行?

<div :title="title"><div>

<script>
export default {
    data () {
        return {
            list: ['第一排','第二排','第三排'],
            title: ''
        }
    },
    created () {
        this.foreach((item) => {
            this.title = item + '<br>'
        })
    }
}
</script>

clipboard.png

如何让div的title像图片中一样能换行呢?

clipboard.png

效果

clipboard.png
没有换行!

虽然问题解决了,但是最后还是直接用了elementtooltip组件!更好控制

阅读 10.1k
4 个回答

https://jsfiddle.net/zwwill/3...

<div :title="title"><div>

<script>
export default {
    data () {
        return {
            list: ['第一排','第二排','第三排'],
            title: ''
        }
    },
    created () {
        this.title = this.list.join('\n');
    }
}
</script>

https://jsfiddle.net/v1un4r4s...

见连接,另外这个明明不关vue什么事情,你用原生js怎么写 用vue就怎么写。

用原生js是拼接字符串那么用vue也一样,同理es6字符串模版也是一样

建议使用第三方 popup 组件,如 element-ui 的 Tooltip,或者 bootstrap 的 popover。

&#10;代替<br/>

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题