React-ace: Bagaimana cara menambahkan cuplikan secara manual tanpa brace?

menabrak

saya memiliki masalah yang sama di sini

Juga mengalami masalah ini. Mencoba hanya menguji dengan potongan python yang disertakan dan itu tidak berhasil.

import React, {Component} from "react";
import AceEditor from "react-ace";
import "ace-builds/src-noconflict/ext-language_tools";
import "ace-builds/src-noconflict/mode-python";
import "ace-builds/src-noconflict/snippets/python";
import "ace-builds/src-noconflict/theme-monokai";

<AceEditor
          mode="python"
          theme="monokai"
          onChange={this.onChange}
          name="editor"
          enableSnippets={true}
          editorProps={{ $blockScrolling: true }}
        />

Itu satu hal, tidak jelas cara menambahkan cuplikan khusus

pon., 23 mar 2020, 21:22 użytkownik Jesse Chua [email protected]
napisał:

Juga mengalami masalah ini. Mencoba hanya menguji dengan python yang disertakan
potongan dan itu tidak berhasil.

import React, {Component} dari "react";
impor AceEditor dari "react-ace";
impor "ace-builds / src-noconflict / ext-language_tools";
impor "ace-builds / src-noconflict / mode-python";
impor "ace-builds / src-noconflict / snippet / python";
import "ace-builds / src-noconflict / theme-monokai";

mode = "python"
theme = "monokai"
onChange = {this.onChange}
name = "editor"
enableSnippets = {true}
editorProps = {{$ blockScrolling: true}}
/>

-
Anda menerima ini karena Anda berkomentar.
Balas email ini secara langsung, lihat di GitHub
https://github.com/securingsincity/react-ace/issues/742#issuecomment-602834865 ,
atau berhenti berlangganan
https://github.com/notifications/unsubscribe-auth/ABK7F6NVYNF3TFKAEWD3OE3RI7AIXANCNFSM4JNTXATQ
.

Saya mendapat cara menambahkan cuplikan, saya akan mengirimkan sampel kode setelah saya membuka pc saya.
Ini sangat mudah.

Saya membuat demo codeandbox untuk Anda tentang cara menambahkan Snippet:
https://codesandbox.io/s/react-acesnippets-sk2uq?file=/src/App.js

Beri tahu saya jika itu membantu.

Jika Anda mendapatkan kesalahan seperti token yang tidak terduga <. di kotak pasir kode.
Muat ulang saja | tutup kesalahannya. Ini hanya masalah dengan sandbox kode !!!

Hai @ mohsinxx365, demo Anda sepertinya tidak berfungsi saat menyegarkan. Menutup jendela token yang tidak terduga hanya akan menampilkan editor kosong.

Saya tidak tahu mengapa masalah itu terjadi. Bagi saya itu berhasil.
Saya akan memeriksanya lagi
Cobalah aplikasi Anda. Saya yakin itu akan berhasil.

Saya akan mencoba untuk memperbaiki masalah Codesandbox. Sehingga siapapun yang memiliki masalah bisa merujuknya.
Untuk saat ini Anda cukup menyalin kode dan mencobanya di aplikasi Anda.
Saya yakin itu akan berhasil.

Coba ketik garis bawah ganda (__) di editor, Anda akan melihat potongan bernama info. Ini akan berhasil.

Lalu tekan enter

Beri tahu saya jika berhasil

Sepertinya ini berfungsi sekarang setelah menyelesaikan garis bawah ganda! Apakah ada cara untuk menampilkan cuplikan secara otomatis tanpa harus melengkapi garis bawah ganda secara otomatis?

Anda bisa mengubah awalan cuplikan untuk tidak menggunakan (__).
Cuplikan disimpan dalam file completeData

Jadi apakah itu berhasil?

Halo Saya mencoba untuk pergi ke tautan Codesandbox tetapi tampaknya tautan tersebut tidak berfungsi lagi?

Ini masalah dengan codesandbox. Cukup salin kodenya dan coba itu akan berhasil.

Tidak, saya tidak melihat kode apa pun. Saya mengklik link tersebut dan mendapatkan pesan "Not Found
Kami tidak dapat menemukan kotak pasir yang Anda cari "

Saya akan segera mengirimkan tautan baru

Apakah ada pembaruan tentang itu?

Menantikan untuk melihat masalah ini diselesaikan.

Selesai. Ini adalah tautan ke kode dan kotak dengan demo dan beberapa dokumentasi:
https://codesandbox.io/s/react-acesnippets-sk2uq?file=/src/App.js

Jika itu menunjukkan token tak terduga '<'
Tutup saja overlay kesalahan dan lanjutkan.
Ini masalah dengan kode dan kotak.

Beritahu saya jika itu membantu Anda

Beritahu saya jika itu membantu Anda

baik!

@orzz bagus

var langTools = ace.acequire('ace/ext/language_tools'); langTools.addCompleter({ getCompletions: function (editor, session, pos, prefix, callback) { if (prefix.length === 0) { return callback(null, []); } else { return callback(null, [ { name: 'name', value: 'value', caption: 'caption', meta: 'snippet', type: 'local', message: 'message', score: 1000 // }, { caption: 'snippet', snippet: Ini adalah cara untuk mengimplementasikan
cuplikan di editor react ace
Dan Ada bonus juga 👌.
Apakah Anda melihat file customTheme.scss itu
Anda dapat menyesuaikan tema di sana
dengan hanya menyesuaikan variabel css di dalamnya. , type: 'snippet' } ]); } } });

Ini adalah modifikasi kode saya sebelumnya. Saya tidak tahu apa yang akan terjadi

@orzz bagus

Saya menggunakan kode sebelumnya untuk memodifikasinya dan ternyata dapat digunakan, tetapi saya tidak tahu apakah akan ada masalah lain

Saya menyarankan Anda untuk menggunakan pendekatan yang saya berikan karena lebih consice (Pendek). Dan bisa dimengerti.

Anda dapat menghapus kode Anda sebelumnya

Saya tidak berpikir itu akan menimbulkan masalah

Saya tidak berpikir itu akan menimbulkan masalah

OK, terima kasih banyak.

misalnya

@ mohsinxx365 bagaimana dengan cuplikan dengan kode dengan placeholder seperti:

values: [${1:values}]

Ada beberapa mekanisme untuk itu juga, sejauh yang saya ingat

Saya akan memeriksa dan memberi tahu segera

Ada beberapa mekanisme untuk itu juga, sejauh yang saya ingat

@ mohsinxx365 ada pembaruan tentang ini?
terima kasih.

@danilafrolov @piotrkochan menggunakan implementasi yang dijelaskan di atas, Anda dapat menggunakan placeholder seperti ini (contoh fungsi lua):

{
    caption: 'function',
    snippet: 'function ${1:name}(${2:arguments})\n\t${3:body}\nend\n',
    meta: 'snippet', //display the keyword "snippet" next to your snippet title in the editor pop-up
}