updated

src/components/goods-card.vue

@@ -0,0 +1,21 @@
+<template>
+    <div class="goods-card">
+        <van-image :src="storeInfo.image"></van-image>
+        <div>{{ storeInfo.title }}</div>
+    </div>
+</template>
+
+<script>
+export default {
+  props: {
+    storeInfo: {
+      type: Object,
+      default: () => ({})
+    }
+  }
+}
+</script>
+
+<style scoped>
+
+</style>

src/plugin/vant.js

@@ -21,7 +21,8 @@ import {
   ActionSheet,
   DatetimePicker,
   Checkbox,
-  CheckboxGroup
+  CheckboxGroup,
+  Search
 } from 'vant'
 
 Vue.use(Button)
@@ -46,3 +47,4 @@ Vue.use(ActionSheet)
 Vue.use(DatetimePicker)
 Vue.use(Checkbox)
 Vue.use(CheckboxGroup)
+Vue.use(Search)

src/router/index.js

@@ -3,8 +3,6 @@ import VueRouter from 'vue-router'
 
 Vue.use(VueRouter)
 
-const Layout = () => import('@/Layout/index.vue')
-
 const routes = [
   {
     path: '/',
@@ -40,7 +38,7 @@ const routes = [
   {
     path: '/shopping-mall',
     name: 'shopping-mall',
-    component: Layout,
+    component: () => import('@/Layout/index.vue'),
     children: [
       {
         path: '/',
@@ -54,7 +52,7 @@ const routes = [
   {
     path: '/mine',
     name: 'mine',
-    component: Layout,
+    component: () => import('@/Layout/index.vue'),
     children: [
       {
         path: '/',

src/views/goods-information/index.vue

@@ -1,6 +1,12 @@
 <template>
   <div class="goods_info">
-    <nav-bar title="商品详情" @click-left="$router.back()"/>
+    <div>
+      <nav-bar title="商品详情" @click-left="$router.back()"/>
+      <van-search v-model="searchVal" placeholder="请输入搜索关键词" />
+    </div>
+    <div>
+      <goods-card />
+    </div>
   </div>
 </template>
 
@@ -8,17 +14,15 @@
 export default {
   data () {
     return {
+      searchVal: ''
     }
   },
   mounted () {
-    console.log(1111)
   },
   methods: {}
 }
 </script>
 
 <style scoped lang="scss">
-.goods_info {
-  width: 100%;
-}
+
 </style>