通过v-on调用函数内部功能：点击

Question

如何才能在函数内调用函数？

模板：（HTML）

<a v-on:click="hello.world"></a> 

JS：（作为组分）

methods: { 
    hello: function() { 
     return { 
      world: function() { 
       alert('hello world'); 
      } 
     }; 
    } 
} 

这我得到了警告：

[Vue公司警告]：事件 “点击” 无效的处理程序：得到未定义

这可能是通过JS 调用this.hello().world()但不是在模板（HTML）像v-on

我错过了什么？

Answer 1

应该在一个有点不同的方式来使用，使其工作

<a v-on:click="hello().world()">foo</a> 

http://jsbin.com/lizerazire/edit?html,js,output

Answer 2

我不认为这是一个vue问题。

this.hello().world()无效，因为world()现在无法访问。试试在和hello功能的加入双括号()：

methods: { 
    hello: function() { 
    return { 
     world: function() { 
      alert('hello world'); 
     } 
    }(); 
    } 
} 

，您现在可以访问这样的内部函数：this.hello.world();

Answer 3

只要定义世界作为一个函数或者内部的方法，在全球范围还是在VUE组件并调用它在一个定期的时尚。

<a @click="hello">foo</a>

function world() { 
    alert("hello world"); 
} 

<vue component> { 
    methods: { 
    hello: function() { 
     world(); 
    } 
    } 
} 

或本

<vue component> { 
    methods: { 
    hello: function() { 
     this.world(); 
    }, 
    world: function() { 
     alert("Hello world"); 
    } 
    } 
}