Express JS项目中如何向include引入的布局传入独立本地变量？

你之前的问题在于，写的lysearch路由是用来单独渲染search_job视图的，但实际你是在父视图里用<%- include %>引入这个子视图，这种情况下不会走那个路由，所以子视图拿不到listCities变量。下面给你两种可行的解决方法：

方法一：include时直接传递局部变量 #

这种方法适合需要在父视图的路由里统一获取数据的场景：

1. 在父视图的渲染路由中，获取listCities数据，然后渲染父视图时把数据传进去（或者直接在父视图里临时定义）：

// 父视图的路由示例
exports.parentPage = async (req, res) => {
  try {
    // 获取城市列表数据
    const listCities = function_new.listCities || [];
    // 父视图自身需要的其他数据
    const parentData = { title: "首页" };
    
    // 渲染父视图，把listCities和父视图数据一起传入
    res.render('parent-view', { ...parentData, listCities });
  } catch (error) {
    console.error('error:', error);
    return res.status(500).send('error 500');
  }
};

2. 在父视图中include子视图时，明确传递listCities变量：

<!-- 父视图中的include代码 -->
<%- include('layouts/search_job', { listCities: listCities }) %>

这样子视图就能拿到独立的listCities变量，父视图的其他逻辑不受影响。如果不想父视图全局持有这个变量，也可以在父视图里临时定义后直接传递：

<% const listCities = function_new.listCities || []; %>
<%- include('layouts/search_job', { listCities }) %>

方法二：子视图自行获取数据（完全不依赖父视图） #

如果希望子视图完全独立，不需要父视图传参，可以把获取城市列表的逻辑封装成全局函数，让子视图自己调用：

1. 在Express项目中注册一个全局函数，用于获取城市列表：

// 可以放在app.js或者单独的工具文件里
app.locals.getListCities = () => {
  return function_new.listCities || [];
};

2. 修改search_job.ejs，直接调用全局函数获取数据：

<select id="s_loc">
<% const listCities = getListCities(); %>
<% if (listCities && listCities.length > 0) { %>
 <% listCities.forEach(function(item) { %>
  <option value="<%= item.cit_id %>"><%= item.cit_name %></option>
  <% }); %>
<% } %>
</select>

这样不管哪个父视图include这个子视图，都不需要传参，子视图自己就能拿到数据，完全不影响父视图的变量环境。

内容的提问来源于stack exchange，提问作者Từ Ngô Ngọc