如下示例:
<template>
<div class="main-content">
<h1> {{ Print()}} </h1>
</div>
</template>
<script>
function Print()
{
console.log("AAAAA");
}
export default {
name: "main-content",
data: () => ({
Hiz: "Hello",
})
,created:function()
{
Print();//可以打印出来
console.log("BBBB");
}
};
</script>
请问,如何在 h1 标签内调用这个当前 Scope 内 Print 的方法?因为我不想把这个方法作为 Vue 实例的成员对外可访问。
1
ChanKc 2020 年 8 月 5 日 via Android
改成用 render 函数,template 的话我猜无解
|
2
anguiao 2020 年 8 月 6 日 via Android
template 不让你这么写,除非你在 methods 里面再包一层。
|
4
yellowV2ex 2020 年 8 月 6 日
只有 render 一条路,因为模板里任何东西编译都需要经过 vue,也就是模板只能调用到 export default 里的东西,你没办法隐藏 export 了的东西
https://cn.vuejs.org/v2/guide/render-function.html |
5
hcwhan 2020 年 8 月 6 日
data: () => ({
Print, Hiz: "Hello", }) |
6
calmzhu 2020 年 8 月 6 日 via Android
用过滤器 hack 一下?
顺便问下这需求什么意思 。渲染的时候自动执行? |
7
Dic4000 OP @calmzhu
这个示例只是一个简化后的 Demo,实际的需求是有一个小方法,这个小方法封装了一些多个位置(包括 Template 内)需要用到的相同逻辑,但这个方法不应该让外部访问到。所以在编码过程中就产生了这个问题。 |
8
zqx 2020 年 8 月 6 日 via Android
先放进 vue 实例里,通过 Print 方法的 getter 钩子判断调用上下文,是这个组件实例渲染时才执行,其他情况返回
|
10
suzic 2020 年 8 月 6 日 via Android 不让外部访问到,那也只有用 render 或写成 filter 了
|
11
sunwang 2020 年 8 月 6 日
template 的作用域是当前组件实例,你可以吧 Print 挂在 methods 里面。
methods:{ Print } |
12
suzic 2020 年 8 月 6 日 via Android 看一下 functional,这个可能也能解决楼主的问题
|
13
sunwang 2020 年 8 月 6 日
后面看了下楼主回复,不让外部访问,又想在 template 中拿到,这个好像无解。。除非换成 render 渲染。
|
14
Dic4000 OP 已经解决这个问题了,使用 filter 可解决。感谢 10 楼朋友的提示。
|