0

刚刚使用 Symfony 4.4 和 Webpack Encore 开始一个新项目:Stimulus 就在这里!我从来没有使用过它,它看起来对我来说效果不佳。我的代码有问题吗?我只是有一个渲染的 Symfony 控制器,base.html.twig这个文件包含这个:

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>{% block title %}Welcome!{% endblock %}</title>
        {% block stylesheets %}{% endblock %}
        <link rel="stylesheet" href="{{ asset('build/app.css') }}">
        <script src="{{ asset('build/app.js') }}"></script>
        {% block javascripts %}{% endblock %}
    </head>
    <body>
        {% block body %}{% endblock %}
        <button data-action="click->hello#greet">Greet</button>
    </body>
</html>

并且hello_controller.js包含这个:

import { Controller } from 'stimulus'
export default class extends Controller {
  greet () {
    console.log('Hello, Stimulus!', this.element)
  }
  connect () {
    this.element.textContent = 'Hello Stimulus! Edit me in assets/controllers/hello_controller.js'
  }
}

在浏览器中,当我检查代码时,捆绑的 javascript 代码“渲染”得很好,但是当我单击“问候”按钮时没有任何反应。

4

1 回答 1

1

经过一番调查,必须使用 Twig 中的特殊功能插入 Encore 链接。

事实上,我们应该这样做:

{% block stylesheets %}
    {{ encore_entry_link_tags('app') }}
{% endblock %}
{% block javascripts %}
    {{ encore_entry_script_tags('app') }}
{% endblock %}

代替

<link rel="stylesheet" href="{{ asset('build/app.css') }}">
<script src="{{ asset('build/app.js') }}"></script>
于 2021-01-31T22:18:19.207 回答