最近では、需要のSQLエディタプラグインのコードの導入は、コード・インテリジェンスのヒントを強調必要であり、そのようなコードヒントリストなどのカスタム機能をサポートしています。そこには、関連するデモではありませんので、いくつかのピットを踏むので、カスタムコードの真ん中のリストをヒントに、我々は後で見るために、次のように要約しています。
1.インストール
yarn add react-ace //或 npm install react-ace
プロジェクトの2.はじめに
import AceEditor from 'react-ace';
アセンブリ3.
<AceEditor
ref="editor"
mode="mysql"
theme="xcode"
onChange={this.onChange.bind(this)}
name="UNIQUE_ID_OF_DIV"
editorProps={{ $blockScrolling: true }}
enableBasicAutocompletion={true}
enableLiveAutocompletion={true}
enableSnippets={true}
style={{ width: "100%", height: "100%", fontSize: "18px" }}
onLoad={this.complete.bind(this)}
/>
4.API
- MODE:コード言語、以下のオプションの種類
- テーマ:テーマは、以下のオプションを入力します
- enableBasicAutocompletion自動的に通常、代替タイプ(真/偽)
- enableLiveAutocompletion自動的にリアルタイムで、代替タイプ(真/偽)
- enableSnippetsコード補完、代替タイプ(真/偽)
- onLoad:ロード機能の実行が完了すると、最初のパラメータがあり、インスタンスエディタ
ここでは主にコードヒント、機能の例のカスタムリストの話を次のように実装され
、次のように1.まず、カスタムプロンプトが表示リストを定義
const completers = [
{
name: 'name',
value: 'one',
score: 100,
meta: '手动添加1'
},
{
name: 'name',
value: 'two',
score: 100,
meta: '手动添加2'
},
{
name: 'name',
value: 'three',
score: 100,
meta: '手动添加3'
}
];
方法2.次に、関数レーンをONLOADするために実行されます
complete(editor) {
//向编辑器中添加自动补全列表
editor.completers.push({
getCompletions: function (callback) {
callback(null, completers);
}
});
}
上記。
サンパウロの年は、私はあなたに驚い骨を参照してください、あなたのコードを吹く可能性を秘めている、そこに324.57ギガバイトのフロントエンドの学習教材は、あなたに教えるために!何を、あなたは信じていませんか???
いくつかの最初のカジュアルルックの地図:
確かに十分に見ていません。再びGIFの描画は、体を加熱しますか???
あなたがピットへのフロントエンドを望む以上の技術を学ぶのであれば問題はあり、多くの友人の世界(ベースフレンズ)、参加することを歓迎し、より興味深いの魂、砂の彫刻やドローイングユーザーがオンライン戦い、もっといじめ妹を知っていますアヒルの群れのフロントエンド- ACは、
2次元コードを掃引は、グループああにあなたを引っ張ってお友達に追加します。