vue实现百度翻译API调用 翻译数组对象

import md5 from 'js-md5';
              //需要翻译的数据格式
			  this.routerPropsUs = {
			    "trackDetails":[
			     { "time":"2020-05-08 09:02", "event":"Out for Delivery", "eventCity":"NORTH WALES", "eventState":"PA" },
			     { "time":"2020-05-08 08:51", "event":"Arrived at Post Office", "eventCity":"NORTH WALES", "eventState":"PA" },
			     { "time":"2020-05-08 04:08", "event":"Departed USPS Regional Facility", "eventCity":"PHILADELPHIA PA NETWORK DISTRIBUTION CENTER", "eventState":"" },
			     { "time":"2020-05-07 22:59", "event":"Arrived at USPS Regional Facility", "eventCity":"PHILADELPHIA PA NETWORK DISTRIBUTION CENTER", "eventState":"" }
			     ]}
               var routeArr =  this.routerPropsUs.trackDetails || []
               var old = []; 
               var q='';
               //遍历数据将数组拼接成字符串
               for( let i = 0; i <  routeArr.length; i++ ){
                 for(var attr in routeArr[i]) {
                   old.push(attr)
                   routeArr[i][attr] == '' ? routeArr[i][attr] = ';': routeArr[i][attr]
                   q = q + routeArr[i][attr]+","
                 }
               }
               var appid = '20210714000887853';  //你的appid 需要注册申请
               var key = 'mxaM9IlpEOtBvJpCkc84'; //开发者秘钥
               var salt = (new Date).getTime();  //时间戳或者随机数
               var from = 'en';                  //翻译源语言
               var to = 'zh';                    //翻译的目标语言
               var str1 = appid + q + salt +key; //appid+q+salt+密钥的MD5值
               var sign = md5(str1);             //签名
               let data = {
                 q,
                 appid,
                 salt,
                 from,
                 to,
                 sign
               }
               //这里使用vue-json实现跨域
               npm i -S vue-jsonp
               //main.js中引入vue-jsonp
               import {VueJsonp} from 'vue-jsonp'
               Vue.use(VueJsonp)
               //调用接口
               this.$jsonp("https://fanyi-api.baidu.com/api/trans/vip/translate", data).then((r)=> {
                 //返回的数据字符串格式
                 var transResult = r.trans_result[0].dst;
                 //将字符串转成数组
                 transResult = transResult.split(",")
                 //删除最后一个空的数组
                 transResult.pop()
                 var setArr = []
                 this.fanyi(transResult,setArr)
                 this.fanyiProps = setArr
               })
             }
            //数据处理函数
            fanyi(val,arr) {
		     if(val.length){
	          let arrData = val.splice(0,4)
	          let obj ={
	            time:arrData [0],
	            event:arrData [1],
	            eventCity:arrData [2],
	            eventState:arrData [3]
	          }
	          arr.push(obj)
	          this.fanyi(val,arr)
	        }else{
	          return
	        }
	      }
  • 2
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值