我对部分音不是很熟悉,所以这可能不是正确的方法。这就是我想要做的。
有一个基本的索引页面,加载一个列表,让我们称之为配置。这些配置是从数据库中提取的,并使用基本的ejs语法呈现在索引视图上。
<ul>
<% configs.forEach(function(obj) { %>
<li onclick="configClickHandler('<%= obj.id %>')" class="configLink">
Name: <%= obj.title %>
</li>
<% }); %>
</ul>
当我点击
- 我对backed进行一个fetch调用,它返回一个JSON对象
我想使用该对象来更新UI并显示该对象的详细信息。
我知道我可以用JavaScript做到这一点,在一个函数中构建HTML,然后将其放置在页面上,但我想知道我是否可以利用EJS部分来做到这一点?
就像
<%- include('partials/config,{data:DATAFROMAPI})%>
就像是零件的React……
再次,我可能是错的,部分变量是被设计成这样使用的吗?有没有更好的方法来创建可重用的数据可绑定组件(而不是使用react)?
1条答案
按热度按时间busg9geu1#
我不认为你会找到一个原生的
ejs
解决方案。ejs
不会向客户端提供任何嵌入式语法,因此与像React这样的SPA不同,它不会在后台状态更改时触发重新渲染DOM。此外,基本的html不会在渲染之间存储状态,除非你使用
window.localStorage
,所以假设你没有使用window.localStorage
,那么你会希望避免触发重新渲染,否则你从数据库中提取的JSON将在每次点击时丢失,页面将不会呈现任何内容。我建议在
configClickHandler
函数提取JSON数据后,将子元素节点追加到父节点。在不知道完整实现的情况下,它看起来像这样:
我添加了一个
id
属性,但您可以使用一大堆方法来query DOM nodes。