ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

原生h5和苹果/安卓端交互方法

2020-12-09 13:34:23  阅读:305  来源: 互联网

标签:function responseData answerList h5 item 安卓端 answerDetail checkboxArr 交互


{{title}}

{{beginDesc}}

*{{index+1}}、{{item.title}} (单选) (多选)
-->

var closedFun;

window.onerror = function (err) {
log("window.onerror: " + err);
};

//
function setupWebViewJavascriptBridge(callback) {
if (window.WebViewJavascriptBridge) {
return callback(WebViewJavascriptBridge);
} else {
document.addEventListener(
“WebViewJavascriptBridgeReady”,
function () {
callback(WebViewJavascriptBridge);
},
false
);
}
if (window.WVJBCallbacks) {
return window.WVJBCallbacks.push(callback);
}
window.WVJBCallbacks = [callback];
var WVJBIframe = document.createElement(“iframe”);
WVJBIframe.style.display = “none”;
WVJBIframe.src = “https://bridge_loaded”;
document.documentElement.appendChild(WVJBIframe);
setTimeout(function () {
document.documentElement.removeChild(WVJBIframe);
}, 0);
}

var vueLoad = function (responseData) {
new Vue({
el: “#app”,
data: {
title: ‘’,
beginDesc: ‘’,
questionVOS: [],
radioId: ‘’,
checkboxArr: [],
deliveryStart: “”,
deliveryEnd: “”,
textareaText: “”,
timestamp: “”,
questionId: “”,
questionIdFu: “”,
radioData: {
questionId: “”,
answerDetail: [],
},
checkboxData: {
questionId: “”,
answerDetail: [],
},
inputData: {
questionId: “”,
answerDetail: [],
},
questData: {
questionnaireId: “”,
answers: [],
},
deliveryStatus: “”,
answerList: [],
checkboxList: [],
textareaList: [],
responseTextCon:‘请填写必填项 !’,
requiredx:false,
},
mounted() {
this.getQuestionaireDel()
},

  methods: {
    //单选
    radioClick(id, item, index) {
      item.radioId = id
      item.questionId = item.id
      this.answerList[index] = {
        "questionId": item.id,
        answerDetail: []
      };
      this.answerList[index].answerDetail[0] = {
        "answerDetail": id
      }
      this.$set(this.questionVOS[index], 'radioId', id)
      this.$forceUpdate();
      // console.log(this.answerList);
    },
    //多选
    checkboxClick(i, item, index) {
      var checkboxArr = [];
      if (item.checkboxArr) {
        checkboxArr = item.checkboxArr;
      }
      if (checkboxArr.indexOf(i) > -1) {
        checkboxArr = checkboxArr.filter(function (ele) { return ele != i; });
      } else {
        checkboxArr.push(i);
      }
      let newArray = [];
      for (let i = 0; i < checkboxArr.length; i++) {
        newArray.push({
          'answerDetail': checkboxArr[i]
        })
      }
      this.answerList[index] = {
        "questionId": item.id,
        answerDetail: []
      };
      this.answerList[index].answerDetail = newArray;
      item.checkboxArr = checkboxArr;
      this.$forceUpdate();
      // console.log(this.answerList);
    },
    // 输入框
    textareaInput(item1, item, index, that) {
      this.answerList[index] = {
        "questionId": item.id,
        answerDetail: []
      };
      this.answerList[index].answerDetail[0] = {
        "answerDetail": that.currentTarget.value
      }
      // console.log(this.answerList);
    },
    //提交
    submitClick() {
      var that = this
      console.log(this.answerList)
      console.log(this.answerList.filter(Boolean))
      const answerData = { ...this.questData, answers: this.answerList.filter(Boolean) };
      // console.log('answerData', answerData);
      const requiredQuestions = this.questionVOS.filter(question => question.isRequired === 1);
      const answerComplete = requiredQuestions.some(requiredQuestion => {
        return this.answerList.filter(Boolean).findIndex(
                (answer = {}) => answer.questionId === requiredQuestion.id
                        && answer.answerDetail.length > 0
                        && (answer.answerDetail[0].answerDetail + '').trim().length > 0
        ) === -1;
      });
      console.info('requiredQuestions', requiredQuestions);
      console.info('answerComplete', answerComplete);
      if (answerComplete) {
        this.requiredx = true
        // alert('存在未回答的必答问题,请检查后再提交!');
        return;
      }
      // console.log(JSON.stringify(answerData))
      // closedFun();
      $.ajax({
        type: 'post',
        url: responseData.url + '/apis/space/v1.0/getQuestionnaireAnswer?access_token=' + responseData.access_token,
        contentType: "application/json",
        dataType: "json",
        data: JSON.stringify(answerData),
        headers: {
          space: responseData.space,
          tenantId: responseData.tenantId,
          token: responseData.token,
          'Content-Type': 'application/json'
        },
        success: function (res) {
          // console.log(res.statusCode)
          if(res.statusCode == '0'){
            // closedFun(res);
            console.log("22222222222", res)
            that.answerList = []
          }else {
            that.responseTextCon = '提交失败,请联系管理员!'
          }

        },
        error: function (err) {
          // reject(err)
          console.log(err)
        }
      });
    },
    //获取问卷详情
    getQuestionaireDel() {
      var that = this;
      $.ajax({
        type: 'post',
        url: responseData.url + '/apis/space/v1.0/getQuestionnaireDetail?access_token=' + responseData.access_token,
        dataType: 'json',
        data: {
          questionnaireId: responseData.questionnaireId
        },
        headers: {
          space: responseData.space,
          tenantId: responseData.tenantId,
          token: responseData.token
        },
        success: function (res) {
          res.content.questionVOS.forEach((v, i) => {
            that.questionVOS.push(v)
            if (v.type == 1) {
              that.radioType = v.questionOptionVOS[0].id
            }
          });
          that.questData.questionnaireId = res.content.id
          that.deliveryStatus = res.content.deliveryStatus
          that.title = res.content.title
          that.beginDesc = res.content.beginDesc
        },
        error: function (err) {
          // reject(err)
        }
      });
    },
    chackIndex: function (itemArray, item) {
      if (itemArray != null && itemArray.indexOf(item) > -1)
        return true;
      else
        return false;
    }
  }

})

}

//
setupWebViewJavascriptBridge(function (bridge) {
//
bridge.registerHandler(“registerAction”, function (data, responseCallback) {
alert(“oc请求js 传值参数是:” + data);
//处理oc给的传参
vueLoad(JSON.parse(data));
//处理完,回调传值给oc
responseCallback(“HAHA”);
});
bridge.init(function (message, responseCallback) {

});
closedFun = function () {
  // <!--处理 js 调用 oc -->
  bridge.callHandler(
          "closed",
          "HAH",
          function (response) {
            //处理oc过来的回调
          }
  );
};

});

var responseData = {
access_token: “77918e12-7d83-4733-937b-cfcd07907f4a”,
questionnaireId: “439”,
space: “943”,
tenantId: “002”,
token: “567b9e8d9b290df62dc2c01bd68599e8”,
url: “http://mobile-gateway.hseduyun.net”
};
vueLoad(responseData);

标签:function,responseData,answerList,h5,item,安卓端,answerDetail,checkboxArr,交互
来源: https://blog.csdn.net/weixin_45020738/article/details/110920646

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有