<template> <div class="container"> <div class="name">{{data.name}}</div> </div> </template> <script> export default { name: 'ImageBlock', props: { data: { type: Object, default: () => { return { name:'1号',gltf:'' } } } }, data() { return { } }, created() { }, methods: { } } </script> <style rel="stylesheet/scss" lang="scss" scoped> .container{ display: flex; flex-direction: row; flex-wrap: wrap; height: 30px; background: url("../../../assets/images/btn.png") no-repeat; -webkit-background-size: 100% 100%; background-size: 100% 100%; line-height: 30px; text-align: center; .name{ color: #ffffff; width: 100%; height: 100%; text-align: center; } } </style>