vue声明中的参考对象

时间:2019-01-05 23:42:59

标签: javascript vue.js

我需要一些结构上的帮助。在我的Vue页面中,我有

                 export default { 
    name: 'Member',

    data() {
        return {
                modalImport: false,
                articles: {},
                index: 0                  
        }
    },        
    mounted() {
            } ,

在我的模板部分中,HTML类似于:

                  <div class="col-sm-9">
                        {{index+1}}.
                        <span :id="'status_'+article.uid" class="auto-new"></span>
                        <span :id="'details_' + article.uid">
                            <template v-if="article.authors">{{(article.authors.map(a=>a.name)).join(',')}}.</template>
                            <a v-if="article.title" :href="'https://www.ncbi.nlm.nih.gov/pubmed/'+article.uid" target='_blank'>{{article.title}}</a>
                            <template v-if="article.source">{{article.source}}. </template>

                        </span>
                    </div>

如果我创建用于获取对象文章数据的代码,则只要在导出默认块内创建代码,它就可以正常工作。由于文章可以由值组成,因此我需要使函数独立运行,并在不同的按钮单击时传递变量。如

          function  getArticles(ID_Values){

          }

而不是为每个调用复制代码。如果我在该块之外创建该函数,则会抛出一个错误,说它不知道“ article”是什么,因为它是在函数中引用的,但未在默认块中声明。我希望我很清楚Vue是新手

1 个答案:

答案 0 :(得分:1)

在Vue中将您的功能添加为method

function _thisLine() {
       const e = new Error();
       const regex = /\((.*):(\d+):(\d+)\)$/;
       const match = regex.exec(e.stack.split("\n")[2]);
       console.log('trigger location...'+e.stack.split("\n")[2]);
       console.log('match...'+match);
       return match
         ? {
             filepath: match[1],
             line: match[2],
             column: match[3]
           }
           : "NOT FOUND";
}
function without() {
  return _thisLine(); // this is ok
}
function withPromise() {
  return new Promise(function(resolve, reject) {
    var result = _thisLine(); //inside promise unable to capture current line number
	console.log('result is ...' + result);
    resolve(result);
  });
}
console.log("without Promise", without());
withPromise().then(function(result) {
  console.log("with    Promise", result);
});