React-ace: Adakah contoh bagaimana mendukung penyelesaian kode khusus?

@andrerpena , saya pikir itu harus cukup mudah untuk pelengkap kustom Anda). Saya dapat menguraikan contoh cepat berdasarkan hal serupa yang baru saja saya lakukan dan melihat-lihat dokumen as.

Untuk mengaktifkan penyelesaian, kita perlu menggunakan ekstensi ace:

/* set up custom completer by using a ace extension */
import ace from 'brace'

/* figured out how to load the extension properly
 * by referring to ptmt's response in https://github.com/thlorenz/brace/issues/19
 */
import 'brace/ext/language_tools'
let langTools = ace.acequire('ace/ext/language_tools');

Setup completer seperti ini:

/* your custom completer */
var customCompleter = {
      getCompletions: function(editor, session, pos, prefix, callback) {
           // your code
           /* for example
            * let TODO = ...;
            * callback(null, [{name: TODO, value: TODO, score: 1, meta: TODO}]);
            */
      }
 }
langTools.addCompleter(customCompleter);

Saat ini, ada masalah (#59) yang berhubungan dengan bagaimana opsi editor tambahan harus ditangani. Tanpa itu saya pikir kita perlu meretasnya:

/* in some render somewhere
 * need this refs hack to set an editor option (another open issue in this repo)
 * inspired by elijahsmith's response in https://github.com/securingsincity/react-ace/issues/65
 */
<AceEditor ref="code" ...>

// with that setup, you can do something like
this.refs.code.editor.setOption('enableBasicAutocompletion', true);

Saya minta maaf jika ada yang aneh atau praktik yang buruk. Saya baru memulai dengan react dan baru mulai menggunakan react-ace wrapper di sekitar ace. Meskipun, hampir semuanya didasarkan pada karya orang lain.

Beberapa referensi/contoh cepat lainnya:

• Ace doc tentang mengaktifkan penyelesaian - mereka juga memiliki contoh
• Demo Ace dengan penyelesaian - ctrl+spasi mengaktifkan penyelesaian

@eemp Maaf atas keterlambatan respon dan terima kasih banyak untuk contohnya. Hal ini tampaknya memang cukup mudah. Saya akan mencobanya. Terima kasih lagi.

Tidak perlu peretasan, Anda juga dapat meneruskan semua pelengkap melalui enableBasicAutocompletion sebagai Array, seperti:

<AceEditor
  ...
  setOptions={{
    enableBasicAutocompletion: [this.yourCustomCompleter]
  }}
/>

Saya menambahkan ompleter saya sendiri, tetapi saya perlu menekan ctr+space untuk menampilkan kompetisi, Apakah ada cara untuk menunjukkan penyelesaian secara otomatis.

@go299 Anda hanya perlu mengaktifkan opsi enableLiveAutocompletion di ace.

@fijolekProjects Bagaimana cara menulis

@oakland Tidak tahu tentang dokumen, tetapi inilah contoh yang berfungsi https://github.com/TouK/nussknacker/blob/v0.0.9/ui/client/components/graph/ExpressionSuggest.js#L31
Pada dasarnya ini adalah objek dengan metode getCompletions diimplementasikan. Semoga membantu

@fijolekProjects Terima kasih banyak! Saya akan mencobanya di proyek saya.

bagaimana kita memicu pelengkapan otomatis tanpa ctrl+spasi. Bagaimana jika kita ingin memicu secara otomatis