関数内の関数をv-onで呼び出す：

Question

関数内で関数をどのように呼び出すことができますか？

テンプレート：（HTML）

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

JS：（コンポーネントなど）

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

このIまし警告：

[ヴューが警告]：イベントの無効なハンドラを "クリック"：

v-onのようにこれは、JS でthis.hello().world()を呼び出すことが可能である未定義

を得なくテンプレートで（HTML） 私は行方不明ですか？

Answer 1

それはただ、グローバルまたはVUEコンポーネントで、機能のいずれかの内部メソッドとして世界を定義し、Aにそれを呼び出す

<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

を操作できるようにするビット異なる方法で使用する必要があります定期的なファッション。

<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"); 
    } 
    } 
}