فهرست منبع

修改获取百度汉语的音频问题

gcj 3 سال پیش
والد
کامیت
1a87a55e2a
3فایلهای تغییر یافته به همراه55 افزوده شده و 30 حذف شده
  1. 6 16
      src/components/Adult/preview/components/Intp.vue
  2. 47 12
      src/components/Adult/preview/components/WordPhraseDetail.vue
  3. 2 2
      vue.config.js

+ 6 - 16
src/components/Adult/preview/components/Intp.vue

@@ -119,7 +119,6 @@
 <script>
 import Audio from "./AudioRed.vue";
 import Strockplayredline from "./Strockplayredline.vue";
-import { getHZChineseInfo } from "../../../../api/ajax";
 
 export default {
   name: "WordIntp",
@@ -127,7 +126,7 @@ export default {
     Strockplayredline,
     Audio,
   },
-  props: ["word", "changeIntpShow", "themeColor", "show", "type"],
+  props: ["word", "changeIntpShow", "themeColor", "show", "type", "dataDetail"],
   data() {
     return {
       isPraShow: false,
@@ -138,7 +137,6 @@ export default {
       synonymList: [], // 近义词
       antonymList: [], // 反义词
       termsList: [], // 组词
-      dataDetail: [],
       isHasValue2: "", // 释义里是否含有value2
     };
   },
@@ -161,11 +159,11 @@ export default {
     },
   },
   watch: {
-    word: {
+    dataDetail: {
       handler: function (val, oldVal) {
         let _this = this;
         if (_this.type == "newWordDetail") {
-          _this.getChineseInfo();
+          _this.handleChineseDetail();
         }
       },
       // 深度观察监听
@@ -183,17 +181,7 @@ export default {
     handleSelect(val) {
       this.activeIndex = val;
     },
-    getChineseInfo() {
-      let _this = this;
 
-      let data = {
-        query: this.word.new_word,
-      };
-      getHZChineseInfo(data).then((res) => {
-        _this.dataDetail = res.data.result;
-        _this.handleChineseDetail();
-      });
-    },
     // 处理数据
     handleChineseDetail() {
       let _this = this;
@@ -246,7 +234,9 @@ export default {
   mounted() {
     let _this = this;
     if (_this.type == "newWordDetail") {
-      _this.getChineseInfo();
+      if (_this.dataDetail) {
+        _this.handleChineseDetail();
+      }
     } else {
       if (_this.word) {
         _this.isHasValue2 = "";

+ 47 - 12
src/components/Adult/preview/components/WordPhraseDetail.vue

@@ -215,7 +215,12 @@
           </div>
         </div>
       </div>
-      <Intp :word="data" :themeColor="themeColor" :type="type" />
+      <Intp
+        :word="data"
+        :dataDetail="dataDetail"
+        :themeColor="themeColor"
+        :type="type"
+      />
     </div>
   </div>
 </template>
@@ -224,7 +229,7 @@
 import Strockplayredline from "./Strockplayredline.vue";
 import Audio from "./AudioRed.vue";
 import Intp from "./Intp.vue";
-import { getContent } from "../../../../api/ajax";
+import { getContent, getHZChineseInfo } from "../../../../api/ajax";
 
 export default {
   //import引入的组件需要注入到对象中才能使用
@@ -262,6 +267,7 @@ export default {
       loading1: false,
       loading2: false,
       loading3: false,
+      dataDetail: null,
     };
   },
   //计算属性 类似于data概念
@@ -273,6 +279,9 @@ export default {
         const _this = this;
         if (val) {
           _this.initData();
+          if (_this.type == "newWordDetail") {
+            _this.getChineseInfo();
+          }
         }
       },
       // 深度观察监听
@@ -409,26 +418,50 @@ export default {
     },
 
     initData() {
-      console.log(this.data);
       this.viewIntp();
-      // let Fathernode = document.getElementsByClassName(
-      //   "NPC-Big-Book-preview"
-      // )[0];
-      // if (Fathernode) {
-      //   //   this.height = Fathernode.clientHeight + "px";
-      //   this.height = window.innerHeight + "px";
-      //   this.margintop = "-" + window.innerHeight / 2 + "px";
-      // }
     },
     handleChangeTab(flag) {
       this[flag] = !this[flag];
     },
+    getChineseInfo() {
+      let _this = this;
+      let data = {
+        query: _this.data.new_word,
+      };
+      getHZChineseInfo(data).then((res) => {
+        _this.dataDetail = res.data.result;
+        _this.handleChineseDetail();
+      });
+    },
+    // 处理数据
+    handleChineseDetail() {
+      let _this = this;
+      _this.dataDetail.forEach((item) => {
+        if (item.request.queryType == "entity") {
+          // 读音
+          item.response.entity.forEach((items) => {
+            items.attrs.forEach((itemss) => {
+              if (itemss.key == "pronunciation") {
+                // 音频
+                _this.data.mp3Url = itemss.objects[0]["@value"]
+                  ? itemss.objects[0]["@value"]
+                  : "";
+              }
+            });
+          });
+        }
+      });
+    },
   },
   //生命周期 - 创建完成(可以访问当前this实例)
   created() {},
   //生命周期 - 挂载完成(可以访问DOM元素)
   mounted() {
-    this.initData();
+    let _this = this;
+    _this.initData();
+    if (_this.type == "newWordDetail") {
+      _this.getChineseInfo();
+    }
   },
   //生命周期-创建之前
   beforeCreated() {},
@@ -547,11 +580,13 @@ export default {
         border: 2px solid #bd8865;
       }
       .wordInfor {
+        flex: 1;
         .yinpin {
           display: flex;
           justify-content: flex-start;
           align-items: center;
           margin-bottom: 16px;
+          width: fit-content;
           .pinyintext {
             font-size: 20px;
             line-height: 30px;

+ 2 - 2
vue.config.js

@@ -43,8 +43,8 @@ module.exports = {
       // change xxx-api/login => mock/login
       // detail: https://cli.vuejs.org/config/#devserver-proxy
       [process.env.VUE_APP_BASE_API]: {
-        //target: `https://gcls.utschool.cn/`,
-        target: `https://gcls.helxsoft.cn/`,
+        target: `https://gcls.utschool.cn/`,
+        //target: `https://gcls.helxsoft.cn/`,
         changeOrigin: true,
         pathRewrite: {
           ['^' + process.env.VUE_APP_BASE_API]: ''