描述：
django +vue实现前后台开发时，通过vue.js调用django后台代码，然后渲染Html模板，发现数据总是无法渲染成功
<div id='demo'>
{{info}}
</div>
info始终无法显示
需要verbatim标签进行转义
如下所示：
<div id='demo'>
{% verbatim %}
{{info}}
{% endverbatim %}
</div>
<script type="text/javascript">
var vm = new Vue({
el: "#demo",
data: {
phone: '',
info: null,
data: null,
},
methods: {
submit: function () {
// axios.get('/api/phone/detail/step', {
axios.get('{% url "api:phoneStep" %}', {
params: {
phone: document.getElementById('p1').value,
},
headers: {
'Content-Type': 'application/x-www-form-urlencoded',
'X-CSRFToken': '{{ csrf_token }}',
}
}).then(response => {
this.info = response; // 获取返回值
this.data = this.info.data.data; //获取返回体某个字段的值
str = JSON.stringify(this.info, null, 4); //转换成字符串json
console.log("str:", str);
output1('code', syntaxHighlight(str))
}).catch(function (error) {
console.log(error);
});
},
},
});
</script>
