下载方式更灵活

src/utils/utils.ts

@@ -6,7 +6,33 @@ const getAssetsImagesFile = (name: string) => {
   return modules[path]?.default
 
 };
+//判断设备为安卓
+const isAndroid = () => {
+  console.log("成功进入isAndroid这个方法")
+  var u = navigator.userAgent;
+  if (u.indexOf('Android') > -1 || u.indexOf('Adr') > -1) {
+    return true;
+  }
+  return false;
+}
+// 判断设备为 ios
+const isIos = () => {
+  console.log("成功进入isIos这个方法")
+  var u = navigator.userAgent;
+  if (u.indexOf("iPhone") > -1 || u.indexOf("iOS") > -1) {
+    return true;
+  }
+  return false;
+}
+const isWeixin = () => {
+  var ua = navigator.userAgent.toLowerCase();
+  if (ua.search('micromessenger') !== -1) {
+      return true;
+  } else {
+      return false;
+  }
+}
 
-export default { getAssetsImagesFile: getAssetsImagesFile }
+export default { getAssetsImagesFile: getAssetsImagesFile,isIos,isAndroid,isWeixin }
 
 

src/views/downloadCaigong1/index.tsx

@@ -1,9 +1,9 @@
 import './index.less'
-import React, { useState,useEffect } from "react";
+import React, { useState, useEffect } from "react";
 import utils from '~/utils/utils';
 export const DownloadCaigong1: React.FC = (props: any) => {
     const [tip, setTip] = useState('none')
-    
+
     const is_weixin = () => {
         var ua = navigator.userAgent.toLowerCase();
         if (ua.search('micromessenger') !== -1) {
@@ -11,26 +11,72 @@ export const DownloadCaigong1: React.FC = (props: any) => {
         } else {
             return false;
         }
+    }
+    const downloadButtons = () => {
+        if (utils.isWeixin() && utils.isAndroid()) {
+            return (
+                <React.Fragment>
+                    <a onClick={() => openWxDownloadTip()}>
+                        <div className="download1">
+                            点击下载1
+                        </div>
+                    </a>
+                    <a onClick={() => openWxDownloadTip()}>
+                        <div className="download2">
+                            点击下载(备用)
+                        </div>
+                    </a>
+                </React.Fragment>
+            )
+        }
+        else if (utils.isIos()) {
+            return (
+                <React.Fragment>
+                    <a href="https://itunes.apple.com/cn/app/id1670563437">
+                        <div className="download1">
+                            点击下载1
+                        </div>
+                    </a>
+                    <a href="https://itunes.apple.com/cn/app/id1670563437">
+                        <div className="download2">
+                            点击下载(备用)
+                        </div>
+                    </a>
+                </React.Fragment>
+
+            )
+
+
+        }
+        else {
+            return (<React.Fragment>
+                <a href="https://t1-1305573081.file.myqcloud.com/ctjk/apk/ctjk1.0.0.apk">
+                    <div className="download1">
+                        点击下载1
+                    </div>
+                </a>
+                <a href="https://t1-1305573081.file.myqcloud.com/ctjk/apk/ctjk1.0.0.apk">
+                    <div className="download2">
+                        点击下载(备用)
+                    </div>
+                </a>
+            </React.Fragment>)
+
+
+        }
+
+
     }
     const openWxDownloadTip = () => {
         setTip('block')
-      
+
 
     }
     const closeWxDownloadTip = () => {
         setTip('none')
     }
-    useEffect(()=>{
-        if (is_weixin()) {
-            document.querySelectorAll<HTMLElement>('#app a')[0].style.display = 'none'
-            document.querySelectorAll<HTMLElement>('#app a')[1].style.display = 'none'
-
-        }
-        else {
-            document.querySelectorAll<HTMLElement>('#app a')[2].style.display = 'none'
-            document.querySelectorAll<HTMLElement>('#app a')[3].style.display = 'none'
-
-        }
+    useEffect(() => {
+     
 
     })
     return (
@@ -48,26 +94,8 @@ export const DownloadCaigong1: React.FC = (props: any) => {
                 <img style={{ width: '56.5vw', margin: '0 auto' }} src={utils.getAssetsImagesFile('文字1.png')} alt='' />
             </div>
             <img className="bg" src={utils.getAssetsImagesFile('bg1.png')} alt='' />
-            <a href="https://t1-1305573081.file.myqcloud.com/ctjk/apk/ctjk1.0.0.apk">
-                <div className="download1">
-                    点击下载1
-                </div>
-            </a>
-            <a href="https://t1-1305573081.file.myqcloud.com/ctjk/apk/ctjk1.0.0.apk">
-                <div className="download2">
-                    点击下载(备用)
-                </div>
-            </a>
-            <a onClick={() => openWxDownloadTip()}>
-                <div className="download1">
-                    点击下载1
-                </div>
-            </a>
-            <a onClick={() => openWxDownloadTip()}>
-                <div className="download2">
-                    点击下载(备用)
-                </div>
-            </a>
+
+            {downloadButtons()}
 
         </div>
     )