Vueのコールバック関数をチャット

:この記事はで再現された猿2048ウェブサイト➩ https://www.mk2048.com/blog/blog.php?id=i1jbaabbkj

以下のために使用される唯一のUIフレームワークではありません、コールバック関数?

言葉が前方に来てどのように、ときに使用するいくつかの本を嫌っています。小道具パッケージアセンブリの使用と感じ弊社通常ラインとVueの、。まれに、独自のコールバックを生成しないに見える背の高い上の何かを.......

しかし、パッケージング成分の実際の開発はそうではありません。多くのコンポーネントが必要と親子コンポーネントの通信します

私たちは栗を見てみましょう:

プロダクトマネージャーの需要があり、あなたはクーポンのリストを作成する必要があります。あなたは、その後に必要なクーポンリストコンポーネントにカプセル化されました。次のシングルのお支払いには、呼び出しクーポンリストをそして、それらのいずれかを選択し、そのクーポンに親コンポーネントで選択します

クーポンリスト UIのは(米国のミッションの例で)大体このようなものです:




この需要は難しいように見えますが、実際にそれを作ります。あなたは問題があることがわかります。

どのようにクーポンのコンポーネントのクーポン親コンポーネント選択リストを取得するには?

この時、子供用の靴の多くの初心者Vue.jsは、私がどのようなデータ交換には分からないかもしれません.....メッシー


あなたがを知るない場合Vuex、あなたは事を学ぶことができます。


コールバック関数!

多くの学生のためのコールバック関数は不慣れではありません。AJAXは良い例です

コールバック関数は、正確には何ですか?

コールバック関数は、関数が実行され、別の関数にパラメータとして渡された関数パラメータであり、この機能の実行を渡します。このプロセスは、コールバックと呼ばれています


emmm .....霧。人気のその別のメソッド本体、その後の方法の本体に渡されるパラメータ別のメソッド本体の内側本体への送信を行うための方法。そして、入ってくるパラメータをサポート


彼は==デモを書き、あまり話をしませんでした

まずは、定義してみましょう  サブアセンブリとパッケージングのプロセスを

<template>
  <!--简单点,定义一个按钮 并制定一个点击事件-->
  <button @click="childClick">testCallback</button>
</template>

<script>
  export default {
    name: "ChildComponents",
    props: {
      clickCallBack: {  //定义一个外来方法
        type: Function, //参数类型:函数
        required: true //是否必填:是
      }
    },
    methods: {
      childClick()  {
        this.$props.clickCallBack('这是来自子组件的问候~~'); //调用Props传来的方法体,并送他一个参数~~
      }
    }
  }
</script>

その後、定義親コンポーネントがサブアセンブリを呼び出します

<template>
  <!--调用子组件 传入method里的自定义函数-->
  <child :click-call-back="ParentTest"></child>
</template>

<script>
  import child from './ChildComponents'
  export default {
    name: "ParentComponents",
    components: {
      child
    },
    data() {
      return {
        say: ''
      }
    },
    methods: {
      ParentTest(val) { //自定义的函数 val是子组件给的参数
        this.say= val; //献给data一份问候~
        console.log(val,"in params"); //看看参数有没有值
        console.log(this.say,"in data"); //看看能不能给父组件的data传进去
      }
    }
  }
</script>

まあ、我々は結果を見て:




なるほど、それが通信親のサブコンポーネントの問題を解決することができるように。あなたは遊ぶ楽しさを持つことができます~~


もちろん、解決策を達成するために私自身の気まぐれVueの$は、コールバックの配信を使用することをお勧め発する.....


また、学生はjQueryのコールバック配信の独自のバージョンについて書いてみることができます


おすすめ

転載: www.cnblogs.com/htmlandcss/p/11789529.html