我在vue中有一个数据对象,看起来像这样

rows[
0 {
  title: "my title",
  post: "my post text",
  public: false,
  info: "some info"
},
1 {
 title: "my title",
  post: "my post text"
  public: true,
  info: "some info"
},
2 {
 title: "my title",
  post: "my post text"
  public: false,
  info: "some info"
}
]

然后,我复制该对象并删除某些属性(如果需要),然后将该对象发布到我的后端,如下所示:

var postData = this.rows;
      postData.forEach(function(o) {

        if (o.public === true) {
          delete o.info;
        }
      });

      var uploadData = {};
      uploadData.blogpost = postData;
      axios({
          method: 'post',
          url: myUrl,
          responseType: 'json',
          data: uploadData
        })

问题是delete o.info;也会从我的vm根数据中删除属性,我不明白为什么,因为我创建了一个新变量/将根数据复制到了那个变量中.那么,在发布数据之前,如何从数据中删除某些对象属性,而不改变vue中的根数据?

推荐答案

你需要通过克隆来复制数据.有多种方法可以克隆数据,我建议使用lodash的函数cloneDeep

postDataCopy = _.cloneDeep(postData)

然后你可以随心所欲地修改postDataCopy而不必修改原稿.

Vue.js相关问答推荐

Vuetify快速失败不会阻止发送表单

我可以手动访问 vue-router 解析器吗?

Vue 脚本标签中更漂亮的 destruct 功能

Vue3在'vue-router'中找不到导出'createWebHistory,createRouter'

Polyfill for ie

在 vue-router 中带有路由的 Vuejs2 模态

如何在某些异步数据(在 Vuex 存储中)加载之前防止任何路由?

在渲染组件之前从 api 获取数据

等待来自 WDS 的更新信号

Axios-一次发出多个请求(vue.js)

在组件之间共享数据

如何从 vue.js 捕获 Jquery 事件

使用 Vue 在单个文件组件中调用渲染方法

emit更新数组不起作用

Vue.js 中的 CSS 框架

错误:找不到模块'@vue/babel-preset-app'

无法访问手表处理程序 vuejs 中的数据变量

VueJS 2 + ASP.NET MVC 5

在~/components/AddPlaceModal.vue中找不到导出AddPlaceModal

Vue.js 显示空格(换行符)