如何將 flask 預覽中的元素集成到評論中

Question

在我的 requirements.txt 中，我有：Flask 2.0.3、Flask_Pagedown 0.4.0、Flask-wtf 1.0.1、Jinja2 3.0.3 WTForms 3.0.0 等。第一個代碼是用於預覽文本的視圖，我從中找到它Github https://github.com/miguelgrinberg/Flask-PageDown/blob/main/example/app.py#L20 ，而第二個是與 quill 編輯器完美配合的評論。

為了在提交評論之前獲得預覽，我應該找到一種方法將它們作為一個視圖集成到我的 flask_app.py 中，並將其他元素包含在 .py 和 .html 中。 在單獨的模板中運行時，代碼和腳本都運行良好。

第一個代碼：查看來自 miguelgrinberg 的 flask-pagedown 工作代碼

@app.route('/', methods=['GET', 'POST'])
def index():
    form = PageDownFormExample()
    text = None
    text2 = None
    if form.validate_on_submit():
        text = form.pagedown.data
        text2 = form.pagedown2.data
    else:
        form.pagedown.data = ('# This is demo #1 of Flask-PageDown\n'
                              '**Markdown** is rendered on the fly in the '
                              '<i>preview area below</i>!')
        form.pagedown2.data = ('# This is demo #2 of Flask-PageDown\nThe '
                               '*preview* is rendered separately from the '
                               '*input*, and in this case it is located above.')
    return render_template('index.html', form=form, text=text, text2=text2)

進入第二個代碼：查看評論工作代碼

@app.route('/', methods=['GET', 'POST'])
def index():
    if request.method == "GET":
        return render_template("main_page.html", comments=Comment.query.all())
    if not current_user.is_authenticated:
        return redirect(url_for('index'))
    comment = Comment(content=request.form["contents"], commenter=current_user)
    db.session.add(comment)
    db.session.commit()
    return redirect(url_for('index'))

到目前為止我嘗試過的是將第一個實例放在方法“GET”之后，如下所示：

@app.route("/", methods=["GET", "POST"])
def index():
    if request.method == "GET":
        return render_template("main_page.html", comments=Comment.query.all())        
        form = PageDownFormExample()
        text = None
        text2 = None
        if form.validate_on_submit():
            text = form.pagedown.data
            text2 = form.pagedown2.data
        else:
            form.pagedown.data = ('# This is demo #1 of Flask-PageDown\n'
                '**Markdown** is rendered on the fly in the '
                '<i>preview area below</i>!')
            form.pagedown2.data = ('# This is demo #2 of Flask-PageDown\nThe'
                '<i>preview area below</i>!'
                '*input*, and in this case it is located above.')
        return render_template('preview.html', form=form, text=text, text2=text2)
    if not current_user.is_authenticated:
        return redirect(url_for('index'))
    comment = Comment(content=request.form["contents"], commenter=current_user)
    db.session.add(comment)
    db.session.commit()
    return redirect(url_for('index'))

上面實驗的 html 錯誤在這里：

            <div>
                <h1>Flask-Preview Page</h1>
                {% if text or text2 %}
                <div>
                    <p>Received text was:</p>
                    <pre>{{ text }}</pre>
                    <pre>{{ text2 }}</pre>
                </div>
                <hr>
                {% endif %}
                <div style="width: 800px;">
                    <form method="POST">
                        {{ form.hidden_tag() }} <!-- ---------------- error from here-->
                        <div>
                            <b>{{ form1.pagedown.label }}</b>:
                            {{ form.pagedown(rows=10, style='width:100%') }}
                        </div>
                        <br>
                        <div>
                            {{ form.pagedown2(only_preview=True) }}
                            <br>
                            <b>{{ form.pagedown2.label }}</b>:
                            {{ form.pagedown2(only_input=True, rows=10, style='width:100%') }}
                        </div>
                        <div>{{ form.submit() }}</div> <!-- ------------ error up to here------------- -->
                    </form>
                </div>
            </div>
            <div class="row">
                <form action="." method="POST">
                    <div>
                        <label for="contents">Content</label>
                        <input type="hidden" name="contents" value="<?= html_escape($contents) ?>">
                        <div id="editor" style="min-height: 160px;"><?= $contents ?>
                    </div>
                    <div>
    <button type="submit" name="draft" class="btn btn-success">Post Comment Enable</button>
    </div>
                </form>
<script src="https://cdn.quilljs.com/1.3.7/quill.js"></script>
</script>
            </div>

錯誤從 {{ form.hidden_tag() }} 開始到 {{ form.submit() }}。 當我刪除這些錯誤代碼和“介於兩者之間”時，沒有錯誤，但它只在沒有預覽的情況下出現在羽毛筆編輯器頂部的“Flask-Preview Page”。 不取出這些代碼時，錯誤日志為： jinja2.exceptions.UndefinedError: 'form'

有什么幫助嗎？

Answer 1

如果第 4 個代碼塊中的 HTML 來自 main_page.html，那么錯誤就會出現，因為您從未定義表單 object。 在 python 代碼的第三塊中，如果方法是 GET，則在實例化表單 object 之前返回呈現的 main_page.html。如果方法是 POST，則僅執行來自if not current_user.is_authenticated: on 的代碼。

也許嘗試這樣的事情，看看它是否更好：

@app.route("/", methods=["GET", "POST"])
def index():
    form = PageDownFormExample()
    if request.method == "GET":
        return render_template("main_page.html", comments=Comment.query.all(), form=form)        
    text = None
    text2 = None
    if form.validate_on_submit():
        text = form.pagedown.data
        text2 = form.pagedown2.data
    else:
        form.pagedown.data = ('# This is demo #1 of Flask-PageDown\n'
            '**Markdown** is rendered on the fly in the '
            '<i>preview area below</i>!')
        form.pagedown2.data = ('# This is demo #2 of Flask-PageDown\nThe'
            '<i>preview area below</i>!'
            '*input*, and in this case it is located above.')
    return render_template('preview.html', form=form, text=text, text2=text2)
    if not current_user.is_authenticated:
        return redirect(url_for('index'))
    comment = Comment(content=request.form["contents"], commenter=current_user)
    db.session.add(comment)
    db.session.commit()
    return redirect(url_for('index'))