我已在全球范围内进口了lodash:
window._ = require('lodash'); // app.js
当我在代码中使用它时,比如在方法中,它工作得很好。但是当我试图在模板中使用它时,比如:
{{_.get(user, 'address.name')}}
显示未定义错误:
Property or method "_" is not defined on the instance but referenced during render
为什么会这样呢?我可以重构一个新的变量,然后在代码中赋值,这样就可以了,但是我也想直接在模板上使用它。
3条答案
按热度按时间ctehm74n1#
关于我的评论:我通常不鼓励在VueJS模板中使用第三方util/helper方法。当然,这是个人的选择,但让VueJS直接处理渲染要简单得多(同时也可以防止可能的React问题)。因此,您可以简单地使用一个计算属性(或一个方法,如果您需要传递参数)来生成字符串,然后插入到模板中。
示例:
然后,在模板中,您可以简单地使用
{{ addressName }}
来呈现字符串。如果您需要更灵活、更抽象的动态使用,则可以使用方法来代替。例如,如果您的路径将是动态的,则可以创建一个方法,该方法使用提供的path
参数从this.user
检索数据:在您的模板中,您可以简单地使用
{{ userData('address.name') }}
。2jcobegt2#
这可能是因为呈现(因此调用属性“_”)在示例化之前完成。
在您的情况下,可能必须在渲染之前调用的
created
生命周期回调中设置window._
。但我的建议是在组件的“data”属性中设置此属性,甚至只导入和设置所需的函数。
例如:
7rfyedvj3#
适用于希望lodash在所有文件中全局可用和/或使用
lodash.mixin
s的用户。我决定在
template
中使用app.provide和inject
,我想在其中使用lodash。唯一的问题是我不能使用_
,我不得不解决$_
。文件结构
主文件.js
源代码/实用程序/插件/lodash.js
源代码/组件/基础按钮.vue