web-dev-qa-db-ja.com

アイテムプロバイダー関数を再利用して、Bootstrap-Vueからbテーブルのアイテムを非同期に更新するにはどうすればよいですか？

私はBootstrap-Vue v2.0.0-rc.11を使用していますが、テーブルのコンテンツを更新する方法を理解できません。些細なことだと思います。

アイテムプロバイダー機能を使用して、バックエンドからコンテンツをプルしています。

        <b-table
                 :items="myProvider"
        >

最初の呼び出しは、次のメソッドで問題なく機能します。

export default {
    methods: {
        myProvider(ctx) {
            let promise = axios.get('/backend?currentPage=' + ctx.currentPage);

            return promise.then((response) => {
                return(response.items || []);
            });
        },

行アイテムを複製するには、モーダルを開いて新しい名前を入力します。うまく機能する複製をバックエンドに呼び出します。次に、新しいアイテムを表示するテーブルに表示されているコンテンツを更新します。どうすればよいですか？

考えられる最も簡単な方法は、アイテムプロバイダー関数（ここでは 'myProvider'）を再度呼び出すことです。これはモーダルから実行できますが、正しいパラメーター（ここでは「ctx」）を指定できません。

バックエンドコールを再発行するためにトリガー/発行するイベントはありますか？

私は次のようなことを試しました：

this.$refs.nameOfTable.$forceUpdate()

this.$refs.nameOfTable.$emit('XXX') // XXX = placeholder for various events

ヒントはありがたいです！ありがとうございました。

javascriptvue.jsbootstrap-vue
5
OpenHaus

これはドキュメントには隠されていますが、テーブル参照に対する単純なrefresh（）呼び出しです。

<b-table ref="table" ... ></b-table>
this.$refs.table.refresh();

the docs のイベントベースのデータの更新セクションから。

1
nardnob