javascript - 如何将ejs对象导出到public目录

Question

我正在创建一个 Node Express 应用程序，并使用 ejs 作为我的模板系统。

现在在我的new.ejs文件，我想用 javascript 清除它，这样它将是纯粹的 html 。

我的 new.ejs 中有一个脚本像这样。

    <script> 
          let amount;

          function calculate(){
                  let numOfPersons = Number($('#numOfPersons').val());
                  let tourPrice = Number("<%= tour.price %>"); //ejs object here

                  let totalPrice = numOfPersons * tourPrice
                  $("#total").val(totalPrice);
                  amount = totalPrice
          }   
</script>

现在我尝试将其转移到我的 public/javascript/calculate.js文件，但它说 tour is not defined因为<%= tour %>未导入 calculate.js 内文件。

为了清理我的代码，我在我的 new.ejs 中尝试了这个

 <script src="javascripts/calculate.js">
  export default "<%=  tour %>" //this is the name of my object
</script>

和里面calculate.ejs

import {tour} from "../../views/booking/new.js";

let amount;


          function calculate(){
                  let numOfPersons = Number($('#numOfPersons').val());
                  let tourPrice = Number("<%= tour.price %>");

                  let totalPrice = numOfPersons * tourPrice
                  $("#total").val(totalPrice);
                  amount = totalPrice
          }   

但是它不起作用。我尝试查阅 MDN 的导入和导出，我认为我的语法是正确的，但不起作用。

我做错了什么？请帮忙。

谢谢

Answer 1

当您默认导出时，您不需要在变量周围使用 {}。尝试删除它

在你的代码中 从“../../views/booking/new.js”导入{tour}
但我认为没有名为 new.js 的文件，应该是 new.ejs 尝试使用这个，如果它不起作用，请告诉我。此外，如果您想将任何变量从 ejs 页面传递到服务器，大多数时候我们将绑定(bind)主体参数中的值，并在定向/需要的地方使用该值。