問題タブ [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 投票する
1 に答える
462 参照

draftjs - 反応コンポーネントでDraft-jsの生オブジェクトを取得して表示する方法は?

Draft-js の作成者は「変換ユーティリティをリリースしたくなかった」と述べていますが ( https://github.com/facebook/draft-js/issues/62 )、

生のオブジェクトをデータベースに保存した後、反応コンポーネントで生のオブジェクトを簡単に取得して表示するにはどうすればよいでしょうか?

readOnlyまた、Draft-js Editor コンポーネントとプロップを使用して表示効果を変えるには、表示効果をどのようにカスタマイズすればよいでしょうか? 表示効果をカスタマイズしたいことがよくあるため、表示効果はエディターで編集していたときの効果とは常に異なるためです。

0 投票する
0 に答える
1363 参照

reactjs - プログラムでReactのDraftJSにHTMLコンテンツを追加するには?

私は Draft-JS を初めて使用し、消費するのに十分な適切なテキスト エディターを作成できますが、コーディングによって Textarea の下部に LI アイテムを含む UL リストを追加する必要があります。

Import HTML を使用してから HTML を追加してから、エクスポートしてエディター状態に戻そうとしましたが、元に戻すとやり直しはこのようには機能しません。奇妙に聞こえるかもしれませんが、Draft-JS の適切なリソースを見つけることができないため、ご協力をお願いいたします。

現在使用しているhtmlを追加するための私のコードは次のとおりです。

上記のコードでは、エディターの状態から html を取得し、目的の html 文字列を追加して、html からコンテンツの状態を再生成し、エディターの状態を編集しています。ありがとうございました..

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

reactjs - Draft.js エディターが空です

draftjsエディタの内容が空かどうかをテストする方法は?

私が今持っている唯一のアイデアは、この関数から返されたオブジェクトに対するオブジェクトの比較です:EditorState.createEmpty().getCurrentContent()

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

javascript - Draft.js エディターの焦点を失うことであるぼかしを検出する

Draft.js エディタのフォーカスを失ったかどうかを検出する「正しい方法」はありますか?

ユースケースは、ユーザーが他の場所をクリックした場合に「エディターモードを終了」したいということです。つまり、エディターの readOnly プロップを切り替えます。どうすればこれを理想的に行うことができますか?それを行うのは良い考えですか?(問題はありますか?)

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

reactjs - draft-js と redux-form を組み合わせる

この一般的なアプローチを使用できる 2 つの通常の入力を含むフォームがあります。

また、フォームにdraftJSエディターがあります。送信時にdraftJSコンテンツを(経由でdraft-js-export-html)HTMLに変換し、コンポーネントのマウントプロセスでhtmlをロードする必要があります。それをredux-formと組み合わせる方法は?

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

javascript - ドラフト JS は、handleBeforeInput を使用してテキストを置き換えても、EditorState は変更されません

こんにちは、 Draft-JS に問題があります。ユーザーが「:)」と入力すると絵文字に変わるようにテキストを変更したいのですが、この例では、テストのために「**」を使用して単語を変更したいだけです。どういうわけか、handleInput の this.setState 新しい editorstate は状態を変更しません。

0 投票する
2 に答える
11350 参照

css - React での Draftjs スタイリング

プロジェクトでdraft.jsを使用したいと考えています。独自のcssもあり、インポートする必要があります。ドキュメントには次のように書かれています。

これらのスタイルはテキストの配置、間隔、およびその他の重要な機能のデフォルトを設定するため、エディターをレンダリングするときにこの CSS を含める必要があります。

  1. コンポーネントのレンダリング中に Draft.css を含めるにはどうすればよいですか? メインの index.html に含めますか?
  2. idまた、スタイルを設定できるようにエディタに を与える方法(例: borderpaddingmin-heightなど)
0 投票する
2 に答える
1031 参照

javascript - draft.js にエスケープ キーを認識させるにはどうすればよいですか?

ユーザーがエスケープ キーを入力したときに、入力をキャンセルしてアプリのフィールドをクリアしたいと考えています。keyBindingFn で e.which === 27 のテストを試みましたが、エスケープ キーが押されたときにその関数が呼び出されることはありません (通常のキー、修飾キー、および矢印キーに対しては問題なく呼び出されます)。draft.js で Escape キーの押下を検出するにはどうすればよいですか?

0 投票する
0 に答える
1503 参照

javascript - React Draft.js サーバー側レンダリング

React とサーバー レンダリングでDraft.jsを使用したいと考えています。問題は、コンポーネントが完全にレンダリングされていないことです。そのため、オブジェクト インスペクターでは div 要素を確認できますが、ページは空で、テキスト入力などはありません。

これは私のコンポーネントコードです:

そしてサーバーテストファイル:

助けてくれませんか、どこに問題がありますか? ありがとうございました

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

reactjs - Draft.js と React Native

DraftJs を React Native で移植しようとした人はいますか? それを行う方法はありますか?

https://github.com/facebook/draft-js/issues/138