ok

layouts/basic.vue

@@ -20,15 +20,16 @@
         <MenuItem name="6" to="/go/model">
           <Icon type="ios-analytics"></Icon>建模
         </MenuItem>
-         <MenuItem name="6" to="/go/pictrue">
+         <MenuItem name="7" to="/go/pictrue">
           <Icon type="ios-analytics"></Icon>图片
         </MenuItem>
+         <MenuItem name="8" to="/go/layout">
+          <Icon type="ios-analytics"></Icon>布局
+        </MenuItem>
       </Menu>
     </Header>
-    <Content>
-      <Card class="hp100">
+    <Content>      
         <nuxt />
-      </Card>
     </Content>
   </Layout>
 </template>

pages/go/layout.vue

+<template>
+<Layout>
+    <Sider>
+        <h1>之二十侧栏</h1>
+    </Sider>
+    <Content>
+        <h2>这是内容区</h2>
+    </Content>
+</Layout>
+</template>
+
+<script>
+ export default {
+     layout:"basic",
+   data () {
+     return {
+         color:"#000000",
+         bgcolor:"red"
+     }
+   },
+   methods:{
+       change(v){
+           console.log(v)
+           let rgb=(v.replace("rgba(","").replace(")")).split(",");
+           this.bgcolor= `rgba(${255-rgb[0]},${255-rgb[1]},${255-rgb[2]},1)`
+       }
+   },
+   components: {
+
+   }
+ }
+</script>
+
+<style lang="less">
+
+ #color{
+     .item{
+         margin: 20px 0;
+         padding: 10px;
+         line-height: 300%;
+         border: 1px solid #eee;
+     }
+ }
+</style>