首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >如何在JSON中使用Vue数据属性

如何在JSON中使用Vue数据属性
EN

Stack Overflow用户
提问于 2021-10-05 16:44:20
回答 2查看 38关注 0票数 1

在下面的数据属性下的Vue代码中,如何使用vue数据属性设置json字段:elasticSearchQuery.query.term."searchId.keyword"searchId

代码语言:javascript
运行
复制
const app = Vue.createApp({
    data() {
      return {
        reports: [],
        searchId: "example",
        elasticSearchQuery: {
          query: {
            term: {
              "searchId.keyword": "example",
            },
          },
        },
      };
    },
    methods: {
      getElasticReports() {
  
        axios
          .post("http://localhost:9200/search-reports/_search", this.elasticSearchQuery, {
            headers: {
              "Content-Type": "application/json",
            }
          })
          .then((response) => (this.reports = response.data.hits.hits))
          .catch((error) => console.log(error));
      },
    },
  });
  
  app.mount("#app");

当我设置"searchId.keyword": "example"时,它工作得很好,但是"searchId.keyword": this.searchId不工作,我得到了400个坏的响应

我应该如何将vue数据属性传递到json字段?

EN

Stack Overflow用户

发布于 2021-10-05 16:56:09

您可以尝试使用computed

代码语言:javascript
运行
复制
new Vue({
  el: '#demo',
  data() {
    return {
      reports: [],
      searchId: "example",
      elasticSearchQuery: {
        query: {
          term: {
            ["searchId.keyword"]: this.searchId,
          },
        },
      },
    };
  },
  computed: {
    elSearch() {
      return this.elasticSearchQuery.query.term['searchId.keyword'] = this.searchId
    }
  },
})

Vue.config.productionTip = false
Vue.config.devtools = false
代码语言:javascript
运行
复制
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>
<div id="demo">
  <p>{{elSearch}}</p>
</div>

票数 0
EN
查看全部 2 条回答
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/69454338

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档