javascript - 如何将元素从已安装的元素传递到 HTML 模板

Question

我从 Mounted 中的 api 获取了一些数据。我想通过循环将它们传递给 html 模板，但它仍然不起作用。

HTML

  .date
                .values(v-for="el in document")
                    span {{el.created}}
                    span {{el.document_title}}
                .actions_value
                    .pic
                      i.fas.fa-download
                    span download

VUE.JS

     export default {
      data() {
       return {
         document: {}
        };
     },
     mounted() {
       co.getDocuments(
         this.$store.getters.customer_id,
         this.$store.getters.token
       ).then(data => {
         let dataDoc = data.data;
         console.log(dataDoc);

         Object.values(dataDoc).map(document => {
           return (this.document = document);
        });
       });
      }
    };

循环中的 el 不存在。我尝试将文档分配给 this.document。但仍然有些地方是错误的。

Answer 1

您无法使用 this 关键字在 map 函数中访问 Vue 组件引用。因此，我建议您绑定(bind) Vue 组件引用，而不是默认的 this 运算符。

 Object.values(dataDoc).map(
  function(document) {
    this.document = document;
  }.bind(this) **// like this**
);

样本:https://codesandbox.io/s/vue-template-3hmom