<template> <h1 :class="curClassName" :style="curStyle">{{ curValue }}</h1> </template> <script lang="ts"> import { Environment } from "@/environments/environment"; import { Vue, Component, Prop } from 'vue-property-decorator'; @Component({}) export default class AppPresetTitle extends Vue { /** * 名称 * * @type {string} * @memberof AppPresetTitle */ @Prop() public name!: string; /** * 布局模型详情 * * @type {*} * @memberof AppPresetTitle */ @Prop() public layoutModelDetails: any; /** * 类名 * * @memberof AppPresetTitle */ get curClassName(){ const layoutModel = this.layoutModelDetails[this.name]; return `app-preset-title ${this.name} ${layoutModel.sysCss}`; } /** * 当前容器样式 * * @memberof AppPresetTitle */ get curStyle(){ const layoutModel = this.layoutModelDetails[this.name]; return layoutModel.getElementStyle(); } /** * 当前值 * * @memberof AppPresetTitle */ public curValue: string = ''; /** * 初始化 * * @memberof AppPresetTitle */ public created() { this.curValue = Environment.AppTitle; } } </script> <style lang='less'> @import './app-preset-title.less'; </style>