主页图片

菜单打开

src/components/framework/leftMenu.vue

@@ -5,7 +5,6 @@
     text-color="#fff"
     background-color="#333333"
     active-text-color="#ffd04b"
-    :unique-opened="true"
     :collapse="menuType"
     class="el-menu-vertical-demo">
     <div class="menu-btn" @click="menuType = !menuType">

src/components/main/index.vue

 <template>
-  <div>
+  <div class="index">
     <!-- 组件有两个属性 value 传入内容双向绑定 setting传入配置信息 -->
-    <editor class="editor" :value="content"  :setting="editorSetting" @input="(content)=> content = content"></editor>
+    <img :src="indexImg" class="indexImg"/>
   </div>
 </template>
 
 <script>
   import editor from '@/components/textarea'
+  import indexImg from '../../assets/index.jpg'
   export default {
     data: function () {
       return {
+        indexImg:indexImg,
         content:'我是富文本编辑器的内容',
         //tinymce的配置信息 参考官方文档 https://www.tinymce.com/docs/configure/integration-and-setup/
         editorSetting:{
@@ -24,6 +26,13 @@
 
 </script>
 
-<style scoped>
-
+<style scoped lang="less">
+  .index{
+    height: 100%;
+    background: #eee;
+    overflow: hidden;
+    .indexImg{
+      width: 90%;
+    }
+  }
 </style>