Переглянути джерело

feat: 提供三种落地页展示模式

huangzhichao 1 рік тому
батько
коміт
77c58a518d

+ 6 - 0
src/pages/index/index.less

@@ -0,0 +1,6 @@
+.index {
+  width: 100vw;
+  height: 100vh;
+  display: flex;
+  justify-content: center;
+}

+ 23 - 2
src/plugin/components/custom/index.tsx

@@ -1,10 +1,31 @@
-import { View } from '@tarojs/components'
+import Taro from '@tarojs/taro'
+import { View, Video, Navigator, Button } from '@tarojs/components'
 import React from 'react'
 import './index.less'
 
 const Custom: React.FC = () => {
+  function clickCustom() {
+
+  }
+
   return (
-    <View>Custom</View>
+    <View onClick={clickCustom}>
+      <Navigator url='plugin-private://wxf7261ed54f2e450e/pages/h5/index'>
+        <Button>H5</Button>
+      </Navigator>
+
+      <Navigator url='plugin-private://wxf7261ed54f2e450e/pages/miniWeb/index'>
+        <Button>半屏</Button>
+      </Navigator>
+
+      <Navigator url='plugin-private://wxf7261ed54f2e450e/pages/webview/index'>
+        <Button>全屏</Button>
+      </Navigator>
+
+      <Navigator url='plugin-private://wxf7261ed54f2e450e/pages/webview/index'>
+        <Video autoplay controls={false} loop src='https://xycdn.yishihui.com/ad/prod/video/material_AD_1700025739_1700025739924.mp4' />
+      </Navigator>
+    </View>
   )
 }
 

BIN
src/plugin/image/code.jpg


+ 0 - 0
src/plugin/pages/h5/index.config.ts


+ 6 - 0
src/plugin/pages/h5/index.less

@@ -0,0 +1,6 @@
+view {
+  image {
+    width: 100vw;
+    height: 100vh;
+  }
+}

+ 16 - 0
src/plugin/pages/h5/index.tsx

@@ -0,0 +1,16 @@
+import Taro from '@tarojs/taro'
+import { View, Image } from '@tarojs/components'
+import React from 'react'
+import './index.less'
+import { useDidShow } from '@tarojs/taro'
+import '../../image/code.jpg'
+
+const H5: React.FC = () => {
+  return (
+    <View>
+      <Image src='../../image/code.jpg' showMenuByLongpress/>
+    </View>
+  )
+}
+
+export default H5

+ 0 - 0
src/plugin/pages/miniWeb/index.config.ts


+ 0 - 0
src/plugin/pages/miniWeb/index.less


+ 30 - 0
src/plugin/pages/miniWeb/index.tsx

@@ -0,0 +1,30 @@
+import Taro from '@tarojs/taro'
+import { View } from '@tarojs/components'
+import React from 'react'
+import './index.less'
+import { useDidShow } from '@tarojs/taro'
+
+const MiniWeb: React.FC = () => {
+  useDidShow(() => {
+    Taro.openEmbeddedMiniProgram({
+      appId: 'wx89e7eb06478361d7',
+      path: 'pages/category'
+    })
+  })
+
+  function btnClick() {
+    Taro.openEmbeddedMiniProgram({
+      appId: 'wx89e7eb06478361d7',
+      path: 'pages/category'
+    })
+  }
+
+  return (
+    <View>
+      <button onClick={btnClick}>点击</button>
+      半屏小程序
+    </View>
+  )
+}
+
+export default MiniWeb

+ 22 - 1
src/plugin/pages/webview/index.tsx

@@ -1,10 +1,31 @@
+import Taro from '@tarojs/taro'
 import { View } from '@tarojs/components'
 import React from 'react'
 import './index.less'
+import { useDidShow, useUnload } from '@tarojs/taro'
 
+let count = 0
 const Webview: React.FC = () => {
+  useDidShow(() => {
+    Taro.navigateToMiniProgram({
+      appId: 'wx89e7eb06478361d7',
+      path: 'pages/category'
+    })
+    count++
+    console.log(count)
+
+    if (count > 1) {
+      Taro.navigateBack()
+    }
+  })
+
+  useUnload(() => {
+    count = 0
+  })
   return (
-    <View>Webview</View>
+    <View>
+      全屏小程序
+    </View>
   )
 }
 

+ 3 - 1
src/plugin/plugin.json

@@ -3,7 +3,9 @@
     "custom": "components/custom/index"
   },
   "pages": {
-    "webview": "pages/webview/index"
+    "webview": "pages/webview/index",
+    "miniWeb": "pages/miniWeb/index",
+    "h5": "pages/h5/index"
   },
     "main": "index.ts"
   }