render函数的的数据对象里面的值怎么使用
来源:2-6 【讨论题】Virtual DOM
我要学习去了
2021-08-25
想请问一下render函数里面的数据对象里面的值要怎么使用啊,就说props和attrs,我发现我想在数据对象里面定义一些props,然后想在子集虚拟节点使用它,我发现是不行的,但是如果把props定义在外面,就可以生效,那如果这样子的话数据对象里面的props有什么用呢?
下面例子我想使用数据对象里面定义的arr2,发现根本使用不了,但是定义在外面的props里面的arr就能使用并遍历出来
<script>
import Test from "./Test";
export default {
name: "HelloWorld",
props: {
msg: {
type: String,
},
arr: {
type: Array,
default() {
return ["2222", "43333", "65675", "545636"];
},
},
},
render(h) {
console.log(this)
return h(
"div",
{
class: ["demo", { foo: true }],
props: {
arr2: {
type: Array,
default() {
return ["2222", "43333", "65675", "545636"];
},
},
},
domProps: {
str: 'baz'
},
},
[
h(Test),
this.msg,
h("div", {}, [
h(
"em",
{},
this.arr.map((item) => {
return h("div", { class: "item" }, item);
})
),
]),
// h("div", {}, [
// h(
// "em",
// {},
// this.arr2.map((item) => {
// return h("div", { class: "item" }, item);
// })
// ),
// ]),
]
);
},
};
</script>
<style scoped>
.item {
color: red;
}
</style>写回答
1回答
-
ustbhuangyi
2021-08-25
你在执行 render 函数的时候,传入的 props 肯定是一个对象值啊,怎么能是 prop 的定义呢?
props: { arr2: { type: Array, default() { return ["2222", "43333", "65675", "545636"]; }, }, },
这个是 props 的定义,并非值。
建议把文档这块内容好好读几遍:https://cn.vuejs.org/v2/guide/render-function.html012021-08-26
相似问题