Electron中的OnClickListener

Question

我究竟做错了什么？ 如果我从控制台中选择相同的元素并添加单击侦听器，那么它可以工作……但是，此代码不起作用

const Template = require('./Template')
const mustache = require('mustache')
const DOMHelper = require('./DOMHelper')

class SymbolDefiner extends Template {
  constructor (key, data) {
    super(key)
    this._data = data
  }

  render () {
    super.render(arguments)
    const parent = this._parent
    const props = this._props
    const eventListener = this._listener

    const addSymbol = DOMHelper.createElement('button.btn.btn-primary', parent)
    const btnText = document.createTextNode('Add Symbol')
    addSymbol.appendChild(btnText)

    console.log(addSymbol) // this log succeeds
    addSymbol.addEventListener('click', function () {
        console.log('xx')
    })
  }
}

module.exports = SymbolDefiner

DOMHelper只是通过使用非常简单的'div＃id.class-1.class-2'字符串将元素添加到DOM中的简单函数。 这是DOMHelper的代码：

const obj = {}

obj.createElement = function (selector, parent, props) {
    const details = selector.split('#')
    let eleName, eleId, classList
    if (details.length > 1) {
        // id is present
        eleName = details[0]
        const attribs = details[1].split('.')
        eleId = attribs.shift()
        classList = attribs
    } else {
        const attribs = details[0].split('.')
        eleName = attribs.shift()
        classList = attribs
    }

    const element = document.createElement(eleName)
    element.setAttribute('id', eleId || '')
    for (var i in classList) {
        element.classList.add(classList[i])
    }

    if (props) {
        for (var key in props) {
            element.setAttribute(key, props[key])
        }
    }

    if (parent) {
        parent.appendChild(element)
    }

    return element
}

module.exports = obj

Answer 1

在我添加了所有的代码脚本index.html页面，这是基于关闭空白电子快速从得到启动CLI 这里

我唯一改变的是我没有分离出DOMHelper，而是直接将其内联添加，并且直接使用obj.createElement() 。 它运行完美，因此您编写的所有内容都是正确的。 唯一可能的办法是检查导入的require（'./ renderer.js'）的每个引用，但很可能不是这样，因为文件本身对我来说是空白的。

因此，您的代码是金色的，希望这可以在哪里查找

<!DOCTYPE html>
<html>

<head>
  <meta charset="UTF-8">
  <title>Hello World!</title>
</head>

<body>
  <h1>Hello World!</h1>
  <!-- All of the Node.js APIs are available in this renderer process. -->
  We are using Node.js <script>document.write(process.versions.node)</script>, Chromium
  <script>document.write(process.versions.chrome)</script>, and Electron
  <script>document.write(process.versions.electron)</script>.
  <div id="parentNode"></div>
</body>

<script>
  // You can also require other files to run in this process
  require('./renderer.js')
  var obj = {};
  obj.createElement = function(selector, parent, props) {
    const details = selector.split('#')
    let eleName, eleId, classList
    if (details.length > 1) {
      // id is present
      eleName = details[0]
      const attribs = details[1].split('.')
      eleId = attribs.shift()
      classList = attribs
    } else {
      const attribs = details[0].split('.')
      eleName = attribs.shift()
      classList = attribs
    }

    const element = document.createElement(eleName)
    element.setAttribute('id', eleId || '')
    for (var i in classList) {
      element.classList.add(classList[i])
    }

    if (props) {
      for (var key in props) {
        element.setAttribute(key, props[key])
      }
    }

    if (parent) {
      parent.appendChild(element)
    }

    return element
  }

  var parent = document.getElementById('parentNode');
  const addSymbol = obj.createElement('button.btn.btn-primary', parent)
  const btnText = document.createTextNode('Add Symbol')
  addSymbol.appendChild(btnText)

  console.log(addSymbol) // this log succeeds
  addSymbol.addEventListener('click', function() {
    console.log('xx')
  })
</script>

</html>

Electron中的OnClickListener

问题描述

1 个解决方案

解决方案1
0 2017-09-13 02:33:56

Electron中的OnClickListener

问题描述

1 个解决方案

解决方案1 0 2017-09-13 02:33:56

解决方案1
0 2017-09-13 02:33:56