Javascript 为什么我在vue中的阵列会'；不影响页面数据的更新？

我正在vue中编写一个简单的应用程序，向服务器请求数据。数据被接收并写入两个对象数组，但它们不会更新为我的html

因为我用的是django，所以我不得不更换delimeters。我检查了数据（如果它真的存在），并尝试了一些虚拟数据，以测试vue应用程序是否工作，以及每个人的想法是否正常

Vue应用程序：

var app1 = new Vue({
    delimiters :['[[', ']]'],
    el: "#app-1",
    data:{
        questions : [{text:"test", 'pk':1}],
        possible : [{text:"test", 'pk':1}]
    },
    created:()=>{
        let  pk = $("#pk").val()
        SetupCSRF();
        $.ajax({
            type:"post",
            url:"/tester/test/questions",
            data:JSON.stringify({pk:pk}),
            contentType:"application/json",
            dataType:"json",
            success:(data)=>{
                console.log(data);
                this.questions = data.questions;
                this.possible = data.possible;
            }
        });
    }
});

我使用vue的html的一部分：

[[问题.案文]]
去除
[[p.text]]

添加
点击

问题在于：

已创建：（）=>{

通过使用箭头函数，您将丢失

此

上下文。它不会引用Vue实例，而是将这些属性添加到一个不相关的对象：

this.questions=data.questions；
this.probable=data.probable；

试试控制台日志

这个

，看看我的意思

您只需将其更改为正常函数，如下所示：

已创建（）{

将：[[question.text]]更改为{{question.text}我将分隔符更改为[[]]由于django的模板语言和它使用的是虚拟数据，它只是不更新。要与vue有反应，您必须有数据插值。这是django的问题。它使用相同的样式将数据写入模板，所以我必须通过设置分隔符来更改：

分隔符：['[']，']]

控制台中是否存在错误？