为什么使用 alpinejs 的 codepen 示例不再起作用？

Question

我想用 codepen 示例发布一个 alpinejs 问题， 但是打开我的旧代码笔，我发现它不起作用。 我用 3.x 分支线替换了对 2.1 版本的引用：

  <script src="//unpkg.com/alpinejs" defer></script>

但是在浏览器的控制台中我有几个错误，因为我之前的工作示例现在不起作用。 请检查已保存的笔：https://codepen.io/petrogromovo/pen/yLMNVLr

提前致谢！

Answer 1

当我打开您的 codepen 示例时，一切正常。我在控制台中获得了“appInit::”登录信息，当单击“打开模式”按钮时，showModal 变量会正确更新。 （以与您发布isPageLoaded 变量相同的方式在屏幕上显示它）

但是，您的模态不会显示，因为您在模态上有一个“隐藏”类。 AlpineJS 不会将显示的样式设置为“块”之类的东西。它只是删除了display: none;，并且因为您应用了“隐藏”类，所以模态将永远被隐藏。