我正在使用Polymer 2.0和contenteditable的div属性编写一个非常基本的WYSIWYG丰富编辑器，但是document.execCommand遇到问题并执行了命令insertunorderedlist。如果您选择并突出显示要插入无序列表的文本，然后单击按钮，则该文本在使用Chrome（最新版本）时无法正常工作，或者在使用Safari（最新版本High Sierra）时无法正常工作，只会挂起。如果您在Polymer（纯老式html和javascript）之外尝试此方法，则效果很好。有什么想法如何使它与Polymer 2.0一起使用吗？这是我的代码：
<link rel="import" href="../../bower_components/polymer/polymer-element.html">
<dom-module id="polymerbasic-app">
<template>
<style>
:host {
display: block;
}
</style>
<button on-click="_insertunorderedlist" type="button">Insert Unordered List</button>
<div id="textBox" contenteditable="true">
Bullet One
<br> Bullet Two
<br> Bullet Three
</div>
</template>
<script>
/**
* @customElement
* @polymer
*/
class PolymerbasicApp extends Polymer.Element {
static get is() { return 'polymerbasic-app'; }
static get properties() {
return {
prop1: {
type: String,
value: 'polymerbasic-app'
}
};
}
_insertunorderedlist() {
document.execCommand("insertunorderedlist", false, null); this.$.textBox.focus();
}
}
window.customElements.define(PolymerbasicApp.is, PolymerbasicApp);
</script>
</dom-module>
和index.html：
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, minimum-scale=1, initial-scale=1, user-scalable=yes">
<title>polymerbasic</title>
<meta name="description" content="polymerbasic description">
<link rel="manifest" href="/manifest.json">
<script src="/bower_components/webcomponentsjs/webcomponents-loader.js"></script>
<link rel="import" href="/src/polymerbasic-app/polymerbasic-app.html">
</head>
<body>
<polymerbasic-app></polymerbasic-app>
</body>
</html>
敏捷的棕色狐狸跳过了那只懒狗。
IBü