Vue 使用 渲染函数时，定义在Style 中的css却不生效 |
您所在的位置：网站首页 › 渲染函数vue › Vue 使用 渲染函数时，定义在Style 中的css却不生效 |
Vue 使用 渲染函数时，定义在Style 中的css却不生效
|
Vue 使用 渲染函数时 在函数中设定元素的类名，css写在style之中，页面跑起来之后，在元素身上可以找到类名的、但是style中的css样式类没有被编译出 定义在Style 中的css却不生效 如下图 2处 的 icon-dot 虽然被绑定在元素身上了，但是在控制台的css看就没有，导致3处页面就没有效果
源码 import { h } from "vue"; // const STATUS_MAPPER = { // 1: "启用", // 2: "停用", // 3: "删除", // }; export default { props: { prefixtType: { type: String, default: "circle", }, status: { type: Number, default: 1, }, label: { type: String, default: null, }, }, setup(props) { const childrens = []; // label if (props.label) { childrens.push(h("span", props.label)); } const iClassList = ["icon-dot"]; // defalut class if (props.status == 1) { iClassList.push("text-success"); } childrens.push(h("i", { class: iClassList })); return () => h("div", { class: "prefix-sign-cont" }, [childrens]); }, }; .prefix-sign-cont { display: inline-block; .icon-dot { display: inline-block; height: 6px; width: 6px; border-radius: 50%; vertical-align: middle; margin-bottom: 3px; margin-right: 6px; } .text-success { background-color: #67c23a; } } |
【本文地址】
今日新闻 |
推荐新闻 |