作者热门文章
- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我想在 Vue 中有 ↵ 时渲染换行符。
我关注了 How can I use v-html on the vue?但我无法跟上。
我尝试过的:
var app = new Vue({
el: '#app',
data() {
return {
a: {
country: "England:↵ - Liverpool↵ - Chelsea↵ - Arsenal↵ - MU↵ - City",
},
testObj: "",
};
},
computed: {
jsonFunc() {
return (this.testObj = this.a.country.replace(/↵/g, "<br/>"));
},
},
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>
<div id="app">
<div>
Vue
{{ jsonFunc }}
</div>
</div>
最佳答案
使用 v-html
指示
<template>
<div >
Vue
<span v-html='jsonFunc'></span>
</div>
</template>
<script>
export default {
data() {
return {
a: {
country: "England:↵ - Liverpool↵ - Chelsea↵ - Arsenal↵ - MU↵ - City",
},
testObj: "",
};
},
computed: {
jsonFunc() {
return (this.testObj = this.a.country.replace(/↵/g, "<br/>"));
},
},
};
</script>
关于javascript - 如何在 VueJS 中渲染换行符↵?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/66926538/
我是一名优秀的程序员,十分优秀!