如何解决具有状态设置事件的多个放大器选择器
<amp-selector layout="container" on="select: AMP.setState({
a1SelectedOption: event.targetoption
})">
<div option="a" selected>Option A</div>
<div option="b">Option B</div>
</amp-selector>
<amp-selector layout="container" on="select: AMP.setState({
a2SelectedOption: event.targetoption
})">
<div option="c" selected>Option C</div>
<div option="d">Option D</div>
</amp-selector>
然后我有文本占位符:
<h3 id="a1" [text]="a1SelectedOption">a</h3>
<h3 id="a2" [text]="a2SelectedOption">c</h3>
当有人第一次与任一选择器交互时,另一个占位符被触发并将文本更新为空,例如页面加载后,选择选项 B,占位符 html 变为 <h3 id="a1" [text]="a1SelectedOption">b</h3> <h3 id="a2" [text]="a2SelectedOption">null</h3>
。
我怀疑这是因为在每个选择器的 event.targetoption
语句中都使用了 on
,但我不清楚如何解决 docs on events。
设置独立于其他放大器选择器的变量值的合适方法是什么?
解决方法
AMP 事件模型似乎触发了所有要评估的状态值,因此它会将另一个变量闪烁到具有空值的创建中。
为了防止此变量必须使用默认值进行初始化,即
<amp-state id="a1SelectedOption"><script type="application/json"> "a" </script></amp-state>
<amp-state id="a2SelectedOption"><script type="application/json"> "c" </script></amp-state>
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。