React コンポーネント ライブラリ + SASS モジュール性

React コンポーネント ライブラリの開発を始めており、他の非 React プロジェクトと共有している SCSS コードの一部を再利用したいと考えています。これを実現するために、React コンポーネントで SASS モジュールを使用しようとしています。単純な使用例は問題なく機能しますが、コンポーネント ライブラリを作成しているため、ボタンなどの特定のコンポーネントに複数のスタイルの組み合わせが必要です。さて、ボタンコンポーネントに問題があります。このコンポーネントは非常に単純ですが、3 つの異なるバリアント値があります。これは Button.tsx ファイルです: importReactf...

P粉818306280 2024-03-26 21:31:03 0  2  416

vue3 js コンポーネント: コンポーネントが更新されていません

API からデータを収集するコンポーネントがあります。 API から返されるデータは、詳細を含む配列です。配列内の値の 1 つはレンダリングされるコンポーネントのタイプであり、他のすべてのデータはコンポーネントに渡されます。データベースから返された値に基づいて正しいコンポーネントをレンダリングしようとしていますが、残念ながら機能しません。私は Vue を初めて使用しますが、vue2 では動作しますが、コンポジション API を使用して Vue3 でも動作したいと考えています。これは置き換えたいコンポーネント コードです: <component:is="question.type...

P粉779565855 2024-02-25 14:50:02 0  2  460

関数コンポーネントを反応オブジェクトとして処理するときにエラーが発生しました: オブジェクトは有効な React 子要素ではありません (見つかった: キーを持つオブジェクト)

プロパティが親コンポーネントから渡されたときにレンダリングされるはずの Alert コンポーネントをレンダリングしようとしていますが、「Uncaught Error: Object is not a valid React child (found: with key { message, showAlerts }. 子要素のコレクションをレンダリングしたい場合は、代わりに配列を使用してください。React が関数コンポーネントをオブジェクトとして扱う理由がわかりません。コード サンドボックスのリンク: https://codesandbox.io/s/exciting-スモークミジ

P粉548512637 2023-09-10 11:59:55 0  1  678

JavaScript - 複数のページが同じナビゲーションを共有します。重複を避けるためにこの共有ナビゲーションをどのように導入できますか?

過去に PHP のインクルードを使用した非常に一般的なシナリオが紹介されましたが、これを行うにはフロントエンドでどのようなメソッドを使用できますか?現在導入されているライブラリとしては jQuery と Webpack が挙げられますが、思い浮かぶのは Ajax リクエストを送信してリクエストされたページをコンテナに入れる: {code...} ナビゲーションを jQuery コンポーネントにし、それぞれを使用する...

PHPz 2017-05-19 10:37:36 0  2  872

レコードをコレクションに渡して、Lightning Web コンポーネントに表示できますか?

営業担当者の記録をタイムラインの概念で視覚化する Lightning Web コンポーネントを作成しています。 Salesforce から最近リリースされた API を使用して、タイムライン コンポーネント、スタイルなどを正常に作成し、データを取得しました。詳細については、以下のリンクを記載しました。 JavaScript についてはかなり初心者なので、重大な間違いがあった場合はご容赦ください。 https://developer.salesforce.com/docs/component-library/documentati

P粉811349112 2024-02-21 11:53:49 0  1  330

php73+tp6+think-swoole3.0+sdebug+サービスを開始できません

環境: 通常の操作のために sdebug 環境を削除します: sdebug をセットアップします。swoole を開始できません。そこでスタックし、ログ ファイルに情報が出力されません。また: sdebug2.9.3、sdebug2.6 の順列および組み合わせ php72、php73、php74 はすべて失敗しました。

疯狂的石头 2021-03-29 06:01:47 0  0  1080

nosql - mongodb のインデックス作業がどのように時間を節約するのか詳しく説明してもらえますか?

通常、MongoDB インデックスによりクエリ効率が大幅に向上します。インデックスがないと、MongoDB はデータを読み取るときにコレクション内の各ファイルをスキャンし、クエリ条件を満たすレコードを選択する必要があります。コレクション全体をスキャンするクエリ効率は非常に低く、特に大量のデータを処理する場合、クエリ...

黄舟 2017-05-02 09:25:14 0  2  622

Vue コンポーネント内で Vue を結合して HTML をレンダリングする

プロジェクトを Vue2 から Vue3 にアップグレードしようとしています。そこには、さまざまな Vue コンポーネントのコレクションを含むコンポーネントがあります。 Vue2 での動作方法は、Twig で Twig テンプレート (例: field.twig) を呼び出し、:is 属性と Vue.compile メソッド (<div:is"compile(element.twig) を使用してコンパイルのために Vue に送信します。コンテンツ） ..."）。これは、Twig テンプレートが Vue に送信するものです。 しかし、Vue3 では、これはもう機能しな...

P粉193307465 2024-03-26 14:35:53 0  1  489

Blazor wasm で行ホバーを実装する方法

コレクション内の変数行の数に基づいて変更される Blazor テーブル コンポーネントがあります。 項目名 説明 アップローダー アップロード日 @foreach(variiteminItems){@item.Name@item.Description@item.UserName@item.UploadDate.ToString( " dd-MM-yyyy")DoWork} 私がしなければならないことは、マウスが行の上にあるときに、その行の特定の要素のみが有効になることです。例えば、

P粉425119739 2023-08-13 16:53:14 0  1  512

vue3 が複合 API に変換された後、何も表示されません

何度か確認しましたが、オプション API を複合 API に変換した後、機能しませんでした。何が問題なのかわかりませんが、エラーは表示されません。ただし、オプション API のように画面に何も出力しません。警告のみが表示されます。 runtime-core.esm-bundler.js:40[Vuewarn]: コンポーネントを解決できません: onboardland これがネイティブ カスタム要素である場合は、コンポーネントから除外することで解決されていることを確認してください。これは私の複合 API ですが、動作しません < tem

P粉106711425 2023-09-04 20:42:43 0  1  450

React および Next.js でクライアント側レンダリングを使用することによって発生する React Hydration エラーを修正するにはどうすればよいですか?

React の useEffect フックと組み合わせます。私の目標は、反応ハイドレーション エラーの発生を確実に防止しながら、クライアント側のレンダリングを組み込むことです。私の理解では、クライアント側レンダリングでは、サーバーではなくクライアント ブラウザ上でコンポーネントをレンダリングする必要があるため、パフォーマンスと対話性が向上します。ただし、クライアント側レンダリングへの移行中に、最初にサーバー側でレンダリングされた HTML とその後のクライアント側でレンダリングされたコンポーネントの間の不一致により問題が発生し、React-Hydration-Errors が発生する可能性があ...

P粉144705065 2024-03-31 09:04:35 0  1  505

Vue.js でゲッターや計算されたプロパティを使用するためのベスト プラクティス

私は vue.js が大好きで、計算プロパティと VueXgetters も大好きです。しかし、私の使用方法がパフォーマンスに何らかの欠点をもたらすかどうかがわからない段階に達しました。これは私のコードの一般的なパターンです (ローカル コンポーネント データと計算されたプロパティにも当てはまります): この単純な状態 (真実の情報源) から始めます: exportdefault()=>({bonds:{eth:[],celo:[ ] }}) 私のゲッターでは、通常次のように実行します。

P粉436688931 2024-04-01 18:22:49 0  1  592

固定配置された子によって親のパディングが無視される

スティッキー要素がヘッダーの後ろに来るのを防ぐにはどうすればよいですか?現在のコードスニペットは親にpadding-topを使用しており、追加の子にmargin-topまたは透明な50ピクセルの境界線を使用しようとしましたが、機能しないようです。この場合、スティッキー ラベルで簡単に top:50px を使用できることはわかっていますが、この部分を React コンポーネントに統合したいのですが、特定のサイズを使用すると、すべての Top ディメンションを共有する必要があるため、異なるコンポーネントを組み合わせるのが難しくなります。タイトル/パディングを「ベタ」にして付箋が通過できないようにす...

P粉182218860 2024-04-06 11:42:51 0  1  483

Ajax を使用してデータとファイルを同時にアップロードするにはどうすればよいですか?

jQuery と Ajax を使用してデータとファイルを送信していますが、データとファイルの両方を 1 つのフォームで送信する方法がわかりません。現在、両方のメソッドをほぼ同じように使用していますが、データを配列に収集する方法が異なり、データは .serialize(); を使用しますが、ファイルは =newFormData($(this)[0]); を使用します。これら 2 つの方法を組み合わせて、Ajax 経由でファイルとデータを 1 つの形式でアップロードしますか?データ jQuery、Ajax、html$("form#da

P粉012875927 2023-08-20 14:33:32 0  2  749

Filepond は画像をレンダリングする前に認証ヘッダーを追加します

Vue アプリケーションで filepond プラグインを使用しています。私のアプリケーション要件に完全に適合します。現在、バックエンド サービスは JWT 認証経由で画像を提供しています。カスタムヘッダーをファイルプールに追加してコンポーネントに画像をロードするにはどうすればよいですか?これが私が達成したことです<file-pondref="file"name="filepond":label-idle="placeholder"accepted-fi

P粉201448898 2024-03-27 13:06:23 0  1  470

オーバーフロー: スクロールすると、テーブルの非表示の列が表示されなくなります。何が悪かったのか？

私は、react-grid を既存の flask アプリケーションに統合しています。これを行うには、カスタム Webpack 構成を使用してアプリケーションをコンパイルする必要があります。反応コンポーネントを正常にレンダリングできますが、react-grid を使用して overflow:scroll を適用すると、テーブルの表示部分のみがレンダリングされ、残りのスクロール領域は空白のままになります。ここをクリックすると、オーバーフロー スクロールが有効になっている ReactGrid の GIF が表示されます。ここをクリックすると、オーバーフロー スクロールが有効になっていない React...

P粉345302753 2023-08-17 13:55:29 0  1  467

Vue 3 の単一のスクリプト タグ内の複数のコンポーザブル インスタンス

現在、OptionsAPI を使用して作成したコンポーネントの書き直しに取り組んでいます。コード シェアリングの観点から見ると、興味深い書き換えポイントは、モーダル ボックスの多くに、表示されるすべての場所に独自のクローズ/オープンおよびブール ロジックが付加されていることです。私の問題は、1 つのコンポーズ可能な関数を複数のモーダル インスタンスで機能させる方法を理解するのに苦労していることです。次の非常に単純な例を考えてみましょう: Modal.vue<template><divv-if="isOpen"@click=

P粉763748806 2024-01-17 09:49:26 0  1  518

【フロントエンド就活必読】フロントエンド開発面接の質疑応答厳選_延長質問

あなたが遭遇した最も難しい技術的問題は何ですか?どうやって解決しましたか？よく使われるライブラリは何ですか?一般的に使用されるフロントエンド開発ツールは何ですか?どのようなアプリケーションやコンポーネントを開発しましたか?ページの再構築はどのように行われますか? IE が他のブラウザと異なる機能を挙げてください。 Web サイトの 99% をリファクタリングする必要があると述べているのはどの本ですか?グレースフル デグラデーションとプログレッシブ エンハンスメントとは何ですか? WEB アプリケーションがサーバーからクライアントにデータをアクティブにプッシュする方法は何ですか? Node の長...

天蓬老师 2017-11-13 13:07:13 1  2  1896

複数の ID を含むフォームを渡し、AJAX を使用して PHP に選択します

選択したチェックボックスを収集し、更新または削除して、このフォームをajax経由でphpに渡そうとしています。私はこれにまったく慣れておらず、方法を見つけるために数日を費やしました。 Web リサーチでは結果が得られませんでした。いくつかの異なる方法で ajax を送信してみましたが、結果は得られませんでした。 PHP のみを使用していますが、select 配列と ids 配列を含むフォームを取得します。 AJAX で動作させるにはどうすればよいですか?私のフォーム。テーブルの内側に置いてあります。テーブルの本体はphpファイルにあります。そのファイルのモーダルウィンドウ内に他のフォームがあり...

P粉729198207 2024-02-26 14:17:13 0  1  500

パゴダパネルとは何ですか?またその役割は何ですか?

簡単に言うと、Pagoda は、Apache、MySQL、PHP、Nginx などの Web サービスで一般的に使用されるソフトウェア ツールを統合した WEB サーバー スイートで、人気のある WEB サーバー パネルです。簡単に言えば、ウェブサイトの運用と保守を容易にすることです。 Pagoda パネルを使用する前に、xshell などのリモート接続ソフトウェアを使用してクラウド サーバーに接続 > PHP 動作環境 (LNMP_+LAMP_) または Java 動作環境を手動でインストール > > インストール

七秒 2021-10-22 11:28:01 0  3  5642