我在Vue中遇到了一个奇怪的行为。请参阅以下vue.html代码：
<label :text=
"$props.information ? (($props.information.primary || $props.information.secondary) | myFilter) : `No info`">
</label>这将无法编译，Vue会抛出以下警告：[Vue warn]: Property or method "myFilter" is not defined on the instance but referenced during render. Make sure to declare reactive data properties in the data option. (found in Root)
然而，当我不使用三元运算符时：
<label :text=
"($props.information.primary || $props.information.secondary) | myFilter">
</label>它编译得很好，找到了myFilter。myFilter在boot.ts中声明。为什么它在第一个例子中抛出？作用域没有区别。
3条答案
按热度按时间wvt8vs2t1#
一个竖线是bitwise-or operator。Vue做了一些特殊的解析，将其解释为绑定中的“pipe to filter”，但（我推测）仅作为绑定表达式末尾的一个或多个出现，而不是中间，就像你的三元用法一样。
7eumitmz2#
表达式语法定义为
(JavaScript expression) + (prop | filters)。过滤器只能附加到有效的JavaScript -将过滤器带入JavaScript是不会发生的。您已经可以在JavaScript表达式中使用
$options.filters.myFilter(prop)。请参考这里：https://github.com/vuejs/vue/issues/5449#issuecomment-294337677
ru9i0ody3#
为我工作：
：text=”
${props.information.primary ? props.information.primary : myFilter}“其他选项是：
：text=”
${props.information ? props.information.primary ? props.information.secondary : myFilter}“