axios put 请求问题

Question

我目前正在建立一个博客，但我被困在编辑文章部分。

所以，在编辑文章页面上，我使用 v-model 来从 vue 存储中检索数据：

<form action="/http://localhost:4000/articles" method="POST">       
  <div role="button" type="submit" @click="submitArticle">Save</div>

    <div class="article-writing__inner" v-for="article in articles">

     <div class="title-offset">Title</div>
      <input class="input-title"  type="text" v-model="article.title"/>

     <tinymce id="d1"v-model="article.text"></tinymce>

   </div>
</form>

我为 v-for 循环使用计算属性：

computed: {
    articles() {
       return this.$store.state.articles
      }
 }

最后我使用 axios 将数据发送到 API，如下所示：

methods: {
        submitArticle() {
            axios.put('http://localhost:4000/articles/:id', {
                title: article.title,
                text: article.text,
            })
                .then(function (response) {
                    console.log(response);
                })
                .catch(function (error) {
                    console.log(error);
                });
        }
    }

正如我所料，我无法访问 axios 中的 store (v-model) 数据。在创建文章模板中，我使用了如下所示的 v-model 并成功使用title: this.title 发布。

data() {
  return {
    title: "",
    text: ""
  }
}

如何将 v-model 从本地组件数据函数绑定到 axios？或者这是另一种方法吗？

感谢您的宝贵时间:)

Answer 1

在对 axios 的 put 调用中，Article 未设置为任何内容。在 axios 调用中获取状态值的一种方法是执行以下操作。

submitArticle() {
    let vm = this;
    axios.put('http://localhost:4000/articles/:id', {
            title: vm.article.title,
            text: vm.article.text,
        })
            .then(function (response) {
                console.log(response);
            })
            .catch(function (error) {
                console.log(error);
            });
    }
}

这都是关于 axios 调用上下文中“this”的范围。