問題タブ [draftjs]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票する
3 に答える
7830 参照

javascript - Draft.js でテキストを揃える方法

下の図のように、Draft.jsでテキストを揃える方法を考えています。

テキスト揃え

これを数日間検索しましたが、解決策が見つかりませんでした。

0 投票する
1 に答える
4344 参照

html - DraftJS Editor にある特定のテキスト/ブロックを html に置き換える方法は?

アプリケーションの React ベースの Web ページでリッチ テキスト機能を使用するために DraftJS Editor を使用しています。

次の要件があります。

ユーザーが # キーを入力すると、エディターの横にドロップダウンが表示され、ユーザーはそこからオプションを選択できます。彼の選択に応じて、# を HTML に置き換えたいと思います。

ユーザーがエディターで # 文字を入力するとすぐにドロップダウンを表示するロジックを作成しましたが、そのハッシュ文字を他の HTML/テキストに置き換える方法がわかりません。

これを行う方法を見つけるためにグーグルで検索しましたが、これまでのところ見つけることができませんでした。これに関する正確な例の1つです。

誰かがこれについてガイドできますか?いくつかの例でより良いですか?

注: メンションのような機能を提供する DraftJS プラグインがいくつかあることは知っていますが、私はそれらを使用したくありません。むしろ、上記のコンテンツ置換機能を使用して独自のロジックを進めたいだけです。

0 投票する
1 に答える
1838 参照

javascript - DraftJS でカスタム定義型を設定する

DRAFTBLOCKTYPEのブロック タイプを使用する代わりに、独自のブロック タイプを定義できるかどうかに興味があります。

現在、draft-image- pluginという名前のプラグインを使用するdraft-wysiwygで遊んでいます。問題は、プラグインを機能させるのではなく、ブロックのタイプとしてを渡さなければならないことです。block-imageatomic

実際、プラグインのタイプをatomic. atomicしかし、blockRenderer がそのプラグインの blockRenderer によって「飲み込まれる」ため、独自の blockRendererFn を作成できないアプリケーションのタイプを持つ他のブロックに影響します。

ブロック タイプを に設定するには、次のatomic方法で簡単に実現できます。

block-imageブロック タイプをやなどのblock-tableカスタム定義タイプに設定する方法 それは可能ですか?

0 投票する
1 に答える
7270 参照

reactjs - 選択を移動せずに空のブロックを Draft.js に追加します

SelectionState を変更せずに、空のスタイル設定されていないブロックを Draft.js エディターに追加する最良の方法は何ですか?

0 投票する
1 に答える
10581 参照

javascript - React & Draft.js - convertFromRaw が機能しない

Draft.js を使用してテキスト エディターを実装しています。エディターのコンテンツを DB に保存し、後でそれを取得して、エディター ページに再度アクセスするときなどに、エディターに再度挿入したいと考えています。

まず、これらは関連するインポートです

DB にデータを保存する方法 (親コンポーネントにあります)

DB を確認すると、次のオブジェクトが表示されます。

これまでのところ、私は他のことを試してみましたが、データベース内のオブジェクトは確実に変換されました。たとえば、convertToRaw() メソッドを呼び出さずにコンテンツを保存すると、さらに多くのフィールドがあります。

データを新しい EditorState として設定する

DB から Data を取得して EditorState として設定するために、私もいろいろ試しました。以下は私の最良の推測です:

コンポーネントをレンダリングすると、次のエラーが発生します。

どんな助けでも大歓迎です!

0 投票する
1 に答える
1358 参照

javascript - 選択範囲をメモで強調表示し、カーソルを合わせると編集可能に表示されます

私はdraft.jsを使用して、テキストを修正する機能を備えたテキストエディターを実装しようとしています。アイデアは、エラーを強調表示し、それを修正するためのメモを書くことです。強調表示されたテキストにカーソルを合わせると、メモが表示され、編集可能になります。

テキストを強調表示するインライン スタイルを既にいくつか作成しましたが、インライン スタイルは一部のテキストをスパン (または別の) でラップし、スタイルを与えることしかできません ( https://facebook.github.io/draft-js/docs/advanced -topics-inline-styles.html#content )

ただし、メモを表示して最終的に編集するには、onmouseover / onmouseleave イベントを処理する必要があります。

選択範囲だけをブロックなどでラップすることはできますか? ブロックは、インライン スタイルのような別のブロック内のスパンになります ...

0 投票する
1 に答える
4756 参照

reactjs - draft.jsにリンクを実装するには?

公式リンクのが壊れています (findLinkEntities 関数に渡される contentState がありません)。draft.js を介したリンクの他の実装はありますか?

0 投票する
1 に答える
3487 参照

javascript - DraftJS Uncaught TypeError:未定義のプロパティ「ブロック」を読み取れません

データベースからデータを読み取り、反応を介して DOM にレンダリングしようとしています。入力には、draft.js を使用し、db に保存する前に convertToRaw を実行しました。ただし、convertFromRaw とレンダリングを実行すると、コンソールに次のエラーが表示されます。draft.js を使用するのはこれが初めてなので、何が間違っているのかわかりません。誰か助けてくれませんか?どうもありがとう!