Vue.jsでセレクトボックスで選択した値を別コンポーネントにあるaxios apiの引数に使いたいです。

以下の機能をVue.jsで実装したいのですが、コンポーネント間のデータの受け渡しでつまずいてます。

①セレクトボックス１にAPI１から取得したBigQueryのテーブル名を表示し、選択する
②①で選択したテーブル名の文字列をAPI２の引数に渡して、テーブル内のカラムリストを取得して表示する

そこで、親コンポーネントであるSelectTable.vueから子コンポーネントであるSelectTag.vueへのデータの受け渡し方に関する記述方法でアドバイスを頂きたいです。よろしくお願いします。

API１のデータ表示済み。API２のデータは固定値の文字列を与える事で動作を確認できてます。

SelectTable.vue

<template>
  <div>
    <select v-model="table_list_selected">
        <option v-for="table in tables" :key='table.id'>{{ table }}</option>
    </select>
  </div>
</template>
<script>
import axios from 'axios'
import SelectTag from './SelectTag'

export default {
  components: {
    SelectTag
  },
  data () {
    return {
      tables: '',
      table_list_selected: ''
    }
  },
  created () {
    axios.get('API for テーブルリスト').then(response => {
      this.tables = response.data
    })
 }
}
</script>

SelectTag.vue

<template>
  <div>
    <select v-model="tag_list_selected">
        <option v-for="tag in tags" :key='tag.id'>{{ tag }}</option>
    </select>
  </div>
</template>
<script>
import axios from 'axios'

export default {
  props: {
    table_list_selected: {
      type: String,
      requried: true
    }
  },
  data () {
    return {
      tags: '',
      tag_list_selected: ''
    }
  },
  created () {
    axios.get('API for カラムリスト', {
      params: {
        tableName: 'ここにセレクトボックスの選択値を入れたいです'
      }
    }).then(response => {
      this.tags = response.data
    })
  }
}
</script>