modify shopApp style

src/case/shopApp/src/App.css

@@ -1,3 +1,24 @@
-.App{
+.AppWrap{
     height: 100%;
-}
+    display: flex;
+    justify-content: center;
+    align-items: center;
+}
+
+.App{
+    box-sizing: border-box;
+    position: relative;
+    width: 375px;
+    height: 667px;
+    overflow: hidden;
+    border-radius: 25px;
+    padding: 15px 0;
+    overflow-x: hidden;
+    overflow-y: hidden;
+    
+}
+
+*::-webkit-scrollbar {display:none !important}
+
+
+

src/case/shopApp/src/App.js

@@ -5,7 +5,7 @@ import 'antd-mobile/dist/antd-mobile.css';
 
 import TabBarBottom from './components/App/TabBarBottom'
 
-class App extends Component {
+class ShopApp extends Component {
   constructor(props){
     super(props)
     this.state={
@@ -15,10 +15,13 @@ class App extends Component {
   //showComponent
   render() {
     return (
-      <div className="App">
+      <div className="AppWrap">
+        <div className="App">
         {this.state.showComponent==='TabBarBottom'?<TabBarBottom />:''}
+        </div>
       </div>
+     
     );
   }
 }
-export default App;
+export default ShopApp;

src/case/shopApp/src/components/App/TabBarBottom.css

@@ -1,4 +1,4 @@
-/* .TabBarBottom{
-    position: absolute;
+div.TabBarBottom{
+    position: absolute !important;
     bottom: 0;
-} */
+} 

src/components/app/App.jsx

@@ -23,6 +23,9 @@ import axios from 'axios';
 import {getCookie} from "../cookie";
 import Schema from "../common/schema/Schema";
 
+//引入案例
+import ShopApp from '../../case/shopApp/src/App'
+
 axios.defaults.withCredentials = true;
 
 const {SubMenu} = Menu;
@@ -302,6 +305,7 @@ class App extends Component {
                                 key={locale ? locale.locale : 'en'/* Have to refresh for production environment */}>
                             <Switch>
                                 <Route path="/" exact component={TrialCase}/>
+                                <Route path="/ShopApp" component={ShopApp}/>
                                 <Route path="/graphql-service/:sidebar/:case" component={TrialCase}/>
                                 <Route path="/wechat-service/:sidebar/:case" component={WechatService}/>
                                 <Route path="/quant-service/" component={QuantService}/>

src/index.js

@@ -1,9 +1,9 @@
 import React, {Component} from 'react';
 import ReactDOM from 'react-dom';
 import './index.css';
-//import App from './components/app/App'
+import App from './components/app/App'
 import * as serviceWorker from './serviceWorker';
-/*
+
 import ApolloClient from "apollo-boost";
 import {ApolloProvider} from "react-apollo";
 
@@ -72,10 +72,8 @@ class MainApp extends Component {
             </ApolloProvider>
         )
     }
-} */
-
-import App from './case/shopApp/src/App'
+}
 
-ReactDOM.render(<App/>, document.getElementById('root'));
+ReactDOM.render(<MainApp/>, document.getElementById('root'));
 
 serviceWorker.unregister();