ログインをしてページを更新するだけでお金を稼ぐことが出来ます。
ページの作成

ページの作成

親となるページを選択してください。

ページは必ず何かしらの親ページに紐づきます。
親ページに紐づくページを子ページといいます。
例: 親=スポーツ, 子1=サッカー, 子2=野球

子ページを親ページとして更に子ページを作成することも可能です。
例: 親=サッカー, 子=サッカーのルール

親ページはいつでも変更することが可能なのでとりあえず作ってみましょう!
テンプレートを更新

13. 【Vue.js】Mixinを利用した共通処理の記述方法

共通の処理

共通処理用のvueファイルを作成して以下の様に共通化したい処理を記述する。

内容はなんでもよい。

Common.vue
<script>
    export default {
        created() {
            this.getMessages()
        },
        data() {
            return {
                messages: [],
            }
        },
        methods: {
            getMessages() {
                axios
                    .get('/api/message/list')
                    .then(res =>  {
                        this.messages = res.data
                    })
            },
        }
    }
</script>

 

 

共通処理を呼び出す処理

mixinsを使用して引数に共通処理のファイルを指定する。

Example.vue

<script>
   
import Common from './Common.vue'

    export default {
       
mixins: [Common],
        created() {
            this.getChannelsTest()
        },
        data() {
            return {
                channels: [],
            }
        },
        methods: {
            getChannelsTest() {
                axios
                    .get('/api/channels/test')
                    .then(res =>  {
                        this.channels = res.data
                    })
            },
        }
    }
</script>

子ページ
子ページはありません
同階層のページ
  1. インストール
  2. for 繰り返し処理
  3. ifの条件分岐とtemplateを用いたグループ化
  4. on:click クリック時のイベント処理
  5. modelとdata フォーム入力値とDOMへの即時反映
  6. computed(算出プロパティ)と使い方とdataとの違い
  7. ライフサイクルフック(created / mounted / updated / destroyedの使い方)
  8. $nextTickの使い方(ライフサイクルフック)
  9. メソッドの定義方法
  10. エラー一覧
  11. ルーティング設定
  12. aリンクの貼り方と動的URLの作成
  13. Mixinを利用した共通処理の記述方法
  14. v-bindによるデータ連携
コメント一覧

コメントがありません