我有包含的字符串###,我正在用数组值替换。现在我想将它们与组件一起使用,我创建了该组件并且它可以工作,但我不知道如何在字符串中使用它。我不想手动包装它们,因为我不知道字符串将如何,它可以有多个###. 如果有 2 ###, options 将有 2 个子数组。
更好的方法是什么?
代码: https: //jsfiddle.net/tsobh4nu/
Vue.component('opt', {
template: `<label>
<span class="bold" v-for="(str,idx) in options">
{{str + " / "}}
</span>
</label>`,
props:{options: Array}
})
new Vue({
el: '#app',
data: {
str: "I have ### and you have a ###.",
options: [
['AAA', 'BBB', 'CCC'],
['XXX', 'YYY', 'ZZZ']
]
},
computed:{
replacedStr(){
let newStr = this.str;
this.options.forEach(option=>{
newStr = newStr.replace('###',this.concatenateOptions(option));
})
return newStr;
}
},
methods: {
concatenateOptions(strArr) { …Run Code Online (Sandbox Code Playgroud)