vue的:title如何换行?

Question

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

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

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

效果

没有换行!

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

Answer 1

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

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

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

Answer 2

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

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

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

Answer 3

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

Answer 4

用
代替<br/>