Блог

Я как бы переходил на React, когда функции без состояния были популярны, поэтому я никогда не сталкивался с классовым подходом к этому, что меня сейчас беспокоит..

Я не уверен, что делает эта функция:

     var keywordMapper = this.createKeywordMapper({
        "constant.false": 'false',
        "constant.true": 'true',
    }, "identifier", true);
 

Который вызывается как:

     this.$rules = {
        "start": [{
            token: "constant.numeric", // float
            regex: "[ -]?\d (?:(?:\.\d*)?(?:[eE][ -]?\d )?)?\b"
        }, {
            token: keywordMapper,
            regex: "[a-zA-Z_$][a-zA-Z0-9_$]*\b"
        }, {
            token: "keyword.operator",
            regex: "\ |\-|\/|\/\/|%|<@>|@>|<@|amp;|\^|~|<|>|<=|=>|==|!=|<>|="
        }]
    };
 

Я думаю, что он отображает входные данные (какие входные данные) и возвращает либо ‘false’, ‘true’, либо ‘identifier’ по умолчанию.

Но что, если я хочу использовать его в функциональном компоненте без состояния? Поскольку я не могу использовать это там.

Любая помощь или объяснение того, как работает «эта» функция, очень ценится.

Приветствую,

редактировать: весь эффект использования:

 useEffect(() => {
const newCompleter = {
  getCompletions(editor, session, pos, prefix, callback) {
    callback(null, completions);
  },
};

const keywordMapper = this.createKeywordMapper({
  "constant.false": 'false',
  "constant.true": 'true',
}, "identifier", true);

const completionString = completions.map((x) => x.value).join('|');
const session = editor.current.editor.getSession();
session.setMode(`ace/mode/text`, () => {
  const rules = session.$mode.$highlightRules.getRules();
  if (Object.prototype.hasOwnProperty.call(rules, 'start')) {
    rules.start = [
      {
        token: 'constant.numeric', // float
        regex: '[ -]?\d (?:(?:\.\d*)?(?:[eE][ -]?\d )?)?\b',
      },
      {
        token: keywordMapper(),
        regex: '[a-zA-Z_$][a-zA-Z0-9_$]*\b',
      },
      {
        token: 'keyword.operator',
        regex:
          '\ |\-|\/|\/\/|%|<@>|@>|<@|amp;|\^|~|<|>|<=|=>|==|!=|<>|=',
      },
    ];
  }
  // }
  // force recreation of tokenizer
  session.$mode.$tokenizer = null;
  session.bgTokenizer.setTokenizer(session.$mode.getTokenizer());
  // force re-highlight whole document
  session.bgTokenizer.start(0);
});
// to extend existing
// addCompleter(myCompleter);
// to override all
setCompleters([newCompleter]);
  }, [completions]);
 

Исходный компонент класса

 ace.define("ace/mode/brms_highlight_rules", ["require", "exports", 

"module", "ace/lib/oop", "ace/mode/text_highlight_rules"], function(require, exports, module) {
    "use strict";

    var oop = require("../lib/oop");
    var TextHighlightRules = require("./text_highlight_rules").TextHighlightRules;

    var BrmsHighlightRules = function() {

        var FalseBool = (
            "false"
        );

        var TrueBool = (
            "true"
        );

        var keywordMapper = this.createKeywordMapper({
            "constant.false": 'false',
            "constant.true": 'true',
        }, "identifier", true);

        this.$rules = {
            "start": [{
                token: "constant.numeric", // float
                regex: "[ -]?\d (?:(?:\.\d*)?(?:[eE][ -]?\d )?)?\b"
            }, {
                token: keywordMapper,
                regex: "[a-zA-Z_$][a-zA-Z0-9_$]*\b"
            }, {
                token: "keyword.operator",
                regex: "\ |\-|\/|\/\/|%|<@>|@>|<@|amp;|\^|~|<|>|<=|=>|==|!=|<>|="
            }]
        };
        this.normalizeRules();
    };

    oop.inherits(BrmsHighlightRules, TextHighlightRules);

    exports.BrmsHighlightRules = BrmsHighlightRules;
});

ace.define("ace/mode/brms", ["require", "exports", "module", "ace/lib/oop", "ace/mode/text", "ace/mode/brms_highlight_rules"], function(require, exports, module) {
    "use strict";

    var oop = require("../lib/oop");
    var TextMode = require("./text").Mode;
    var BrmsHighlightRules = require("./brms_highlight_rules").BrmsHighlightRules;

    var Mode = function() {
        this.HighlightRules = BrmsHighlightRules;
        this.$behaviour = this.$defaultBehaviour;
    };
    oop.inherits(Mode, TextMode);

    (function() {
        this.$id = "ace/mode/brms";
    }).call(Mode.prototype);

    exports.Mode = Mode;

});
(function() {
    ace.require(["ace/mode/brms"], function(m) {
        if (typeof module == "object" amp;amp; typeof exports == "object" amp;amp; module) {
            module.exports = m;
        }
    });
})();