Vue.js中的备用绑定语法

Question

题

我想知道是否有一种替代语法来输出Vue.js中的数据,而不是花括号,如ng-bind Angular指令.

阅读文档,似乎Vue.js只接受带有v-bind指令的标签属性,但我希望它也能用于内部html.

上下文

我想使用PHP输出数据,一旦加载页面,就用Vue管理它.想象一下下一个情况:

我们想要这个输出:

 <div>Hello</div> 

首先,我们用php输出数据

 <div><?php echo $hello_string ?></div> 

之后,我们希望能够使用Vue更改内容.目前的语法是;

 <div>{{ hello_string }}</div> 

我们不能混合使用这两种语法,所以我需要这样的东西:

<!--Ideal syntax for mixing vue and php-->
<div v-bind:innerhtml="hello_string"><?php echo $hello_string ?></div> 

谢谢您的帮助.

Answer 1

您可以使用该v-text指令:

<div v-text="hello_string"></div>
<!-- same as -->
<div>{{ hello_string }}</div>

或者v-html:

<div v-html="html"></div>
<!-- same as -->
<div>{{{ html }}}</div>