Vue 3 のコンポジション API で別のファイルの再利用可能なコードを使用するにはどうすればよいですか?
P粉323050780
P粉323050780 2023-08-26 13:01:48
0
1
551
<p>dateTime.js に再利用可能なコードを作成しました: </p> <pre class="brush:php;toolbar:false;">import { ref, computed, watch } from 'vue'; import * as dayjs from 'dayjs'; デフォルト関数のエクスポート dateTime() { const newDateTimeString = ref(null); 関数 showDateTime(data) { const dateTime = dayjs(data).format('DD-MM-YYYY') newDateTimeString.value = 日付時刻; } 戻る { newDateTimeString、 showDateTime } }</pre> <p><strong>dateTime.js のコードは Table.vue で呼び出されます。</strong></p> <p>質問: どうすれば機能しますか?テンプレートで <code>{{ showDateTime(scope.row[itemIn.field]) }}</code> を使用したいと考えています。これにより、最終的に <code>dateTime.js</code> の <code>showDateTime</code> 関数がトリガーされるはずだと思われます。 </p> <p>何を間違えたのでしょうか?エラー コード: <code>Uncaught (in Promise) TypeError: Object(...) は、<code>const { showDateTime } = useDateTime();</code> ; を参照する関数</code> ではありません。 </p> <pre class="brush:php;toolbar:false;"><template v-else-if="itemIn.type == 'dateTime'"> {{ showDateTime(scope.row[itemIn.field]) }} </テンプレート> <スクリプト> import { ref, computed } from 'vue'; 「vue」からインポート {defineComponent}; 「vuex」からインポート { useStore }; import { useDateTime } から '@/composables/dateTime'; デフォルトのエクスポートdefineComponent({ 名前: ""、 小道具: { 処理データ: オブジェクト }、 コンポーネント: { フラグ }、 発行: ["ユニーク", "リフレッシュ"], setup(props, {emit}) { const { showDateTime } = useDateTime(); const ストア = useStore() 関数 setStatus(id, ルート) { const オブジェクト = { やった、 ルート: ルート } 戻りstore.getters.getStatus(オブジェクト); } 戻る { スコープの取得、 setUniqueId、 getクラス、 幅の取得、 ナビゲートページネーション、 セットステータス、 セットタグ、 showDateTime }; } }); </script></pre> <p><br /></p>
P粉323050780
P粉323050780

全員に返信(1)
P粉964682904

exportdefaultexportuseDateTimeフックを使用する場合は、{ }: を使用せずにインポートする必要があります。 リーリー

いいねを押す +0
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート