javascript - axios put 请求问题

标签 javascript vue.js axios vuex

我目前正在建立一个博客,但我卡在了编辑文章部分。

因此,在编辑文章页面上,我使用 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 中的商店(v-模型)数据。在创建文章模板中,我使用了如下所示的 v-model 并且我设法使用 title: this.title 发布。

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

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

感谢您的宝贵时间:)

最佳答案

在对 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);
            });
    }
}

这都是关于“this”在 axios 调用上下文中的作用域。

关于javascript - axios put 请求问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/52390596/

相关文章:

javascript - 对嵌套对象的 javascript 数组进行排序

javascript - 如何在Json Node js中传递变量的值而不是变量名

javascript - BxSlider—单击“幻灯片”查看下一个

javascript - 用于选择的 Vue.js 选项组件

javascript - axios "url"参数必须是字符串类型。收到类型未定义错误

javascript - 如何使用 axios 获取/发布?

javascript - jQuery 给定 div 中每个元素的类

javascript - VueJS 打印 HTML 到页面

vue.js - 将自定义指令添加到 vuejs 渲染函数中的插槽

javascript - UnhandledPromiseRejectionWarning错误使用axios