Как запустить designMode для iframe? - PullRequest
Новая
       51

Как запустить designMode для iframe?

0 голосов
/ 26 января 2019

Я пытаюсь реализовать простой режим разработки iframe, который я инициировал в javascript, в React.Мой чистый код JS: 

<body>
<div id="textEditor">
    <button id="action" title="Bold"><b>Click me</b></button>
    <div id="richTextArea"></div>
        <iframe id="theWYSIWYG" name="theWYSIWYG" frameborder="0"></iframe>
</div>


<script>
    window.addEventListener("load", function () {
        var editor = theWYSIWYG.document;
        editor.designMode = 'on';
</script>

Это работает, конечно.Но попытка в React: 

class ExamCreate extends React.Component {
constructor(props) {
    super(props);
    this.examBody = null
}
state = {
    modalStage: 0,
    newExamName: '',
    newExamDescription: '',
    newExamTime: '',
}
componentDidUpdate = () => {
        var a = this.examBody.document;
        a.designMode = 'on';
}

и jsx: 

<iframe ref={examBody => this.examBody = examBody} 
        id="examBody" name="examBody" frameBorder="0"></iframe>

Но я вообще не могу получить доступ к документу ссылки.Как я могу настроить режим дизайна для iframe ref?

Ответы [ 2 ]

0 голосов
/ 27 января 2019

Мне удалось решить эту проблему, добавив свойство contentWindow следующим образом: 

let editor = this.examBody.contentWindow.document;
editor.designMode = 'on'

Я не знаю, почему в Reacat разные и почему вы не можете напрямую получить документ, надеюсь, он кому-нибудь поможет..

0 голосов
/ 26 января 2019

Я новичок в React, и меня это смущает, почему бы вам не написать this.state внутри конструктора?

...