使用react生命周期解决jquery .bind()匿名函数内的不可变变量

问题描述 投票:0回答:1

我需要访问匿名绑定函数之外的jqconsole变量。我如何在JQuery栖息地之外实例化它?如果可能的话,我会将其保存在全球或我的州。我无法让它以这种方式运行。

  componentDidMount = () => {
    // Execute after fully loaded
    $(window).bind('load', () => {
      const jqconsole = $('#console').jqconsole(
        'Welcome to the console!\n',
        '>'
      );
      // register some workarounds
      jqconsole.RegisterMatching('{', '}', 'brace');
      jqconsole.RegisterMatching('(', ')', 'paran');
      jqconsole.RegisterMatching('[', ']', 'bracket');

      const startPrompt = () => {
        // scroll to bottom -- NOT WORKING YET
        $('#console').scrollTop($('#console')[0].scrollHeight);
        // Start the prompt with history enabled.
        jqconsole.Prompt(true, input => {
          let transformedString;
          // Manage Output
          try {
            transformedString = window.eval(input);
            if (typeof transformedString === 'object') {
              this.writeToConsole(jqconsole, 'object', transformedString);
            } else {
              this.writeToConsole(jqconsole, 'message', transformedString);
            }

            // Restart the input prompt.
            startPrompt();
          } catch (error) {
            this.writeToConsole(jqconsole, 'error', error);
            // Restart the input prompt.
            startPrompt();
          }
        });
      };
      // Restart the input prompt.
      startPrompt();
    });
  };

确切地说:我有这个类方法writeToConsole,并且想要调用它而不必传递jqconsole的实例:

  // Manage Output
  writeToConsole = (jqconsole, type, message) => {
    console.log('writing to console @ console');
    if (type === 'error') {
      jqconsole.Write(message + '\n', 'jqconsole-output-error');
    } else if (type === 'message') {
      jqconsole.Write(message + '\n', 'jqconsole-output');
    } else if (type === 'object') {
      jqconsole.Write(JSON.stringify(message) + '\n', 'jqconsole-output');
    } else {
      console.log('error @ writeToConsole');
      return null;
    }
  };

感谢您的时间和帮助。

javascript jquery reactjs react-lifecycle
1个回答
0
投票

我通过在构造函数中将jqconsole实例化为this.myConsole来解决我自己的问题。这样,它可以在整个组件中访问。

© www.soinside.com 2019 - 2024. All rights reserved.