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