ワイズリマインダー

【Vue3】親から単一コンポーネントの関数を実行させる

index.html

<compo-hoge ref="compoHoge"></compo-hoge>

refを追加する。
値は任意な文字列。

 

index.js

let myVue = Vue.createApp({ ... }.mount('#app');

/*任意のタイミングで*/
myVue.$refs.compoHoge.funcFuga();

compoHogeはindex.htmlで指定したref値。
funcFuga()は実行したい単一コンポーネントmethods内の関数名。
createApp内で呼び出す場合は、myVueの代わりにthisも使用可能。

 

compo_hoge.vue

<script scoped>
export default {
  data(){}
 ,methods; {
    funcFuga(){
      console.log('funcHuga!!');
    }
  }
}
</script>

コメントを残す

メールアドレスが公開されることはありません。 ※ が付いている欄は必須項目です

CAPTCHA


このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください。

検索

最近のコメント

最近の投稿

タグ

Android C841M-4X-JSEC/K9 CentOS CentOS7 chrome cisco CKEditor cmd.exe CompositionAPI css F1 F1 2016 F1 2017 F1 2018 F1 2019 F1 2020 F1 2021 F1 2022 F1 2023 F1 2024 GapChart html HTML5 JavaScript jQuery LapChart Linux MySQL php SFC Vue3 Windows Windows10 WordPress イギリスGP イタリアGP オーストリアGP カスタマイズ ギャップチャート データベース トラブルシューティング ハンガリーGP バーレーンGP モナコGP ラップチャート

フィード配信

RSS 2.0
RDF
atom

アーカイブ

外部リンク