カスタム機能にLaravel Nova使用するカスタムツールを使用vue jsしています。
あるtool.vueコンポーネントのファイル内部には、そこにいるすべてのハンドルは、作成後。重要なのは、さまざまなテンプレート（vueファイル）を用意し、必要なときにいつでもレンダリングしたいということです。
この場合、私のメインtool.vueは完全に実装したドロップダウンを使用した検索です。しかしvue、ボタンをクリックした後、別のファイルからの結果のリストをレンダリングしたいと思います。（もちろん、他のvueファイルはデータを表示するためのテーブルまたは何かで構成されます）。
問題は、vue jsでこれをどのように処理するか、そしてコンポーネント間でどのように変更できるかです。また、メインのvueファイルから結果ページにparamters / dataを渡して、ajaxリクエストなどを実行するにはどうすればよいですか。
ページを動的にSPA形式で処理するには、適切なルーターを使用することをお勧めします。Laravel Novaを使用してvue-routerいるようです。
作成時にカスタムコンポーネントの下にインストールされます。他のvueファイルを使用したり、それらを切り替えnova-components\[your-component-name]\resources\js\tool.jsたりする場合は、次の形式でルートの配列にオブジェクトを追加して、ファイルの下にルートを追加する必要があります。
{
name: '[route-name]',
path: '/[route-path]/:[sent-prop-name]',
component: require('./components/[your-vue-file]'),
props: route => {
return {
[sent-prop-name]: route.params.[sent-prop-name]
}
}
},
このファイルにルーターを追加した後は、いつでも<router-link></router-link>Vueファイル内のコンポーネントを使用して、必要なルートにリダイレクトできます（データを小道具としてルートに送信することもできます）。その主な形式は次のとおりです。
<router-link
class="btn btn-default btn-primary"
target="_blank"
:to="{
name: '[destination-route-name]',
params: {
[your-data-name]: [your-data-value]
}
}"
:title="__('[your-title]')"
>
Submit
</router-link>
PS：もちろん、ファイルとの間でデータを送受信する予定がない場合は、両方から小道具とパラメータを省略できます。
この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。
侵害の場合は、連絡してください[email protected]
コメントを追加