vueでparamsパラメータを渡す方法

Vue.js では、データはキーと値のペアを含むオブジェクトである params パラメーターを通じてサブコンポーネントに渡されます。配信方法は 2 つあります。 ルーティング経由: params パラメータはルート オブジェクトで自動的に取得されます。 props 経由: 子コンポーネントで必要なパラメーターを定義し、v-bind を使用してデータを渡します。

Vue での Params パラメータの転送

Vue.js では、params パラメータが使用されます子コンポーネントにデータを渡すには、渡す必要があるパラメーターのキーと値のペアが含まれるオブジェクトです。

#Params パラメータを渡す方法

params パラメータをサブコンポーネントに渡す方法は 2 つあります。

• ルーティングの使用

ルーティングを使用すると、コンポーネントの

route オブジェクトで params パラメータが自動的に使用可能になります。例:

<code class="javascript">// 父组件
<router-link :to="{ name: 'Child', params: { id: 123 } }">...</router-link>

// 子组件
export default {
  data() {
    return {
      id: this.$route.params.id
    }
  }
}</code>

• Use props

props を使用して params を渡すこともできます。パラメーター。これには、子コンポーネントで必要なパラメータを定義し、v-bind を使用して親コンポーネントにパラメータを渡す必要があります。例:

<code class="javascript">// 父组件
<Child :params="{ id: 123 }"></Child>

// 子组件
export default {
  props: ['params'],
  data() {
    return {
      id: this.params.id
    }
  }
}</code>

注:

ルーティングを使用して
• params パラメータを渡す場合は、 を使用することをお勧めします。ルート名とパラメーターが明確に定義されていることを確認するために、namedroutes。
単純なパラメータの受け渡しには、構文がより簡潔である
• props を使用することをお勧めします。

以上がvueでparamsパラメータを渡す方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。