problem description
export default {
functional: true,
props: {
data: {
type: String,
default() {
return "";
}
},
depth: {
type: Number
}
},
render: (h, ctx) => {
return h("div", {
class: ["treeitem"],
style: {
":hover": {
background: "yellow" // div
},
height: "40px",
lineHeight: "40px",
border: "1px solid -sharpf0f0f0",
"marginLeft": ctx.props.depth*20 + "px"
},
on: {
click: () => {
},
mouseover: () => {
}
}
}, [
h("Icon", {
props: {
type: "arrow-right-b",
},
style: {
marginLeft: "20px",
display: "inline-block",
width: "40px",
hight: "40px"
}
}),
h("span",{
style: {
}
}, ctx.props.data),
h("Button", {
props: {
icon: "ios-gear-outline"
},
style: {
float: "right"
},
on: {
click: () => {
}
}
})
]);
}
}the environmental background of the problems and what methods you have tried
try to add class, to the div element, but as a functional component, this is the js file. Where should I write the style?
related codes
/ / Please paste the code text below (do not replace the code with pictures)