vue+jquery 作用域問題

Question

先上代碼

var app = new Vue({
        el: '#app',
        data: {
            inputable: true,
            canclick: true,
            reply: false,
            name: '',
            email: '',
            content: ''
        },
        methods: {
            sendmsg: function() {
                $.ajax({
                    url: '001.php',
                    type: "POST",
                    dataType: 'json',
                    data: {
                        time: $('#time').val(),
                        name: $('#name').val(),
                        email: $('#email').val(),
                        message: $('#message').val()
                    },
                    success: function(result) {
                        this.canclick = false
                        this.reply = true
                        this.inputable = false
                        console.log(this)
                        console.log("success", result);
                    },
                    error: function(result) {
                        alert('好像哪裡錯了, 請再試一次, 或是email給[e-mail]吧! 我會很謝謝你的')
                        console.log("error", result);
                    }
                })

            }
        },
        computed: ...略

各位大大, 我想請問要在jquery封裝好的ajax對象裡如果要調用外面vue的data值, 要如何調用? success函數裡的this好像是指向 $ajax 如果要指向new Vue 的data, 在ajax裡的success要如何寫呢?

我只想要在success的時候執行this.canclick = false,this.reply = true,this.inputable = false這三個動作, 不曉得有沒有辦法?

                    success: function(result) {
                        this.canclick = false
                        this.reply = true
                        this.inputable = false
                        console.log(this)
                        console.log("success", result);
                    },

Answer 1

在$.ajax()外面把this 给保存下来 var _this = this

Answer 2

es6的箭头函数 sendmsg: (()=>{})

Answer 3

app.canclick = false,app.reply = true,app.inputable = false;这样应该可以(项目用script标签引用可以这样做，vue-cli搭建的工程，楼上的方法可以)