2017-12-27 520 views
0

我看不出與Firefox 57的任何輸出,同時期待 'HyperHtmlElement' ......簡單HyperHtmlElement例子說明不了什麼

<html> 
<head> 
<title>canvas element test</title> 
<meta charset='utf-8'> 
</head> 
<body> 
<g2-canvas></g2-canvas> 
<script src="https://unpkg.com/[email protected]/min.js"></script> 
<script src="https://unpkg.com/[email protected]/min.js"></script> 
<script> 
class G2Canvas extends HyperHTMLElement { 
    created() { 
     console.log('#'); 
     this.render(); 
    } 

    render() { 
     return this.html`<strong>HyperHTMLElement</strong>`; 
    } 
} 
G2Canvas.define('g2-canvas'); 
</script> 
</body> 
</html> 

...我究竟做錯了..?

謝謝。

回答

0

有兩個問題與您的代碼:

  1. 最新HyperHTMLElement自動帶來hyperHTML給你。您不需要同時包含這兩個腳本,只需包含HyperHTMLELement,並可根據需要隨時導入bind,wire和其他方法/實用程序。
  2. Firefox尚未發貨自定義元素。你需要一個polyfill,比如document-register-element或其他。

正如您在this CodePen中看到的那樣,Firefox的行爲確實與Chrome或Safari類似,並且Edge也可以正常工作。

我希望我已經回答了您的問題。