Vueで全てが完結していれば美しいし理想的だけど
設計が悪いのかもしれないが、たまにJavaScriptからVue内部のメソッドをコールしたい時や
Vue内部のデータにアクセスしたい時が発生する。
こんなVueがあったとして
<script>
$(function(){
var app = new Vue({
el: '#app',
data: {
message: ''
},
methods: {
disp(message){
alert(this.message);
}
}
})
});
</script>■Vueの外からメソッドをコール
<script>
app.disp('hello');
</script>Vue内のdispメソッドがコールされ、’hello’アラートが表示される
■Vueの外から変数にアクセス
<script>
alert(app.message);
</script>Vue内のmessage変数の値がアラートで表示される
<script>
app.message = 'abc';
</script>Vue内のmessage変数に’abc’をセットする
カプセル化になってないし
こういう実装の仕方って多分よろしくない方法だと思うけど、一応動作します。
正しい実装を知りたいなぁ。