@shijiu/jsview-vue 0.9.502 → 0.9.590

package/utils/JsViewPlugin/JsvPlayer/JsvMedia.js

@@ -1,6 +1,21 @@
 /* eslint-disable no-prototype-builtins */
 import {getPluginInfo} from './GetVersion'
 
+let EVENT_STATUS_NONE = 0;
+let EVENT_STATUS_LOADSTART = 1;
+let EVENT_STATUS_LOAD = 2;
+let EVENT_STATUS_SEEK = 3;
+let EVENT_STATUS_SEEKED = 4;
+let EVENT_STATUS_STALLED = 5;
+let EVENT_STATUS_RESUME = 6;
+let EVENT_STATUS_DISPLAY = 7;
+let EVENT_STATUS_TIMESHIFT = 8;
+let EVENT_STATUS_TIMESHIFTED = 9;
+let EVENT_STATUS_BACKLIVE = 10;
+let EVENT_STATUS_BACKLIVED = 11;
+let EVENT_STATUS_END = 12;
+
+
 let MediaPluginInfo = getPluginInfo();
 
 var mediaArray = [];
@@ -175,8 +190,8 @@ function findMediaObjectByKey(key){
 }
 
 class JsvBaseMedia {
-    constructor(type, hole_id, player_type, key, background, design_map_width) {
-        logTrace("Create JsvBaseMedia, type="+type+", hole_id="+hole_id+", player_type="+player_type+", key="+key+", background="+background+", design_map_width="+design_map_width);
+    constructor(type, hole_id, player_type, key, background, design_map_width, decode_type) {
+        logTrace("Create JsvBaseMedia, type="+type+", hole_id="+hole_id+", player_type="+player_type+", key="+key+", background="+background+", design_map_width="+design_map_width+", decode_type="+decode_type);
         
         this.state = {
 			muted: false,
@@ -209,9 +224,12 @@ class JsvBaseMedia {
         this.holeIdModify = hole_id;
         this.playerType = player_type;
         this.designMapWidth = design_map_width;
+        this.decodeType = decode_type;
         this.channelID = -1;
         this.ref = 1;
         this.appVisible = window.JsView&&window.JsView.getVisibility?(window.JsView.getVisibility()==="show"):true;
+        this.eventReport = true;
+        this.currentEventStatus = EVENT_STATUS_NONE;
         this._onEvent = this.onEvent.bind(this);
         this._onVisibilityChangeCallBack = this.onVisibilityChangeCallBack.bind(this);
 
@@ -247,7 +265,7 @@ class JsvBaseMedia {
 
         let share_view = true;
 
-        let result = window.jsvPlayerBridge.CreatePlayer(this.key, this.holeId, this.background, this.designMapWidth, share_view, this.playerType, "top.CreatePlayerResult");
+        let result = window.jsvPlayerBridge.CreatePlayer(this.key, this.holeId, this.background, this.designMapWidth, share_view, this.playerType, this.decodeType, "top.CreatePlayerResult");
         if(result > 0){
             this.initPlayer();
         }
@@ -286,7 +304,7 @@ class JsvBaseMedia {
         logDebug("InitPlayer:2, key="+this.key);
 
         if(this.channelID >= 0){
-            this.joinChannel(this.channelID);
+            this.joinChannelPrivate(this.channelID);
         }else if(this.state["src"]){
             this.setState("src", this.state["src"], "string");
             if(this.state["currentTime"]){
@@ -327,7 +345,14 @@ class JsvBaseMedia {
 
     onVisibilityChangeCallBack(){
         let visible = window.JsView&&window.JsView.getVisibility?(window.JsView.getVisibility()==="show"):true;
+
         logDebug("playerKey:"+this.key+", 小程序可见状态: "+visible);
+    
+        if(visible === this.appVisible){
+            logDebug("playerKey:"+this.key+", 小程序可见状态未发生变化，不执行动作");
+            return;
+        }
+
         if(visible){
             this.appVisible = visible;
             this.state.paused = this.local.paused;
@@ -337,6 +362,7 @@ class JsvBaseMedia {
         }else{
             logDebug("playerKey:"+this.key+", playerCreate: "+this.playerCreate+", channelID: "+this.channelID+", src: "+this.state["src"]);
             if(this.playerCreate){
+                this.eventReport = false;
                 if(this.channelID > 0){
                     logDebug("leaveChannel");
                     window.jsvPlayerBridge.leaveChannel(this.key);
@@ -345,7 +371,7 @@ class JsvBaseMedia {
                     this.local.currentTime = this.currentTime;
                     this.local.paused = this.paused;
                     logDebug("currentTime: "+this.local.currentTime);
-                    this.unload();
+                    this.unloadPrivate();
                 }
             }
             this.appVisible = visible;
@@ -396,11 +422,107 @@ class JsvBaseMedia {
         }
     }
 
+    needReportEvent(event){
+        let ret = true;
+        if(!this.eventReport){
+            ret = false;
+            switch(this.currentEventStatus){
+                case EVENT_STATUS_NONE:
+                    this.eventReport = true;
+                    ret = true;
+                    break;
+                case EVENT_STATUS_LOADSTART:
+                    if(event == EVENT_STATUS_LOADSTART || event == EVENT_STATUS_LOAD || event == EVENT_STATUS_DISPLAY || event == EVENT_STATUS_BACKLIVED || event == EVENT_STATUS_TIMESHIFTED){
+                        this.eventReport = true;
+                    }
+                    if(event == EVENT_STATUS_LOADSTART){
+                        ret = false;
+                    }else{
+                        ret = true;
+                    }
+                    break;
+                case EVENT_STATUS_LOAD:
+                    if(event == EVENT_STATUS_LOAD || event == EVENT_STATUS_DISPLAY || event == EVENT_STATUS_BACKLIVED || event == EVENT_STATUS_TIMESHIFTED){
+                        this.eventReport = true;
+                    }
+                    if(event == EVENT_STATUS_LOADSTART || event == EVENT_STATUS_LOAD){
+                        ret = false;
+                    }else{
+                        ret = true;
+                    }
+                    break;
+                case EVENT_STATUS_DISPLAY:
+                    if(event == EVENT_STATUS_DISPLAY || event == EVENT_STATUS_BACKLIVED || event == EVENT_STATUS_TIMESHIFTED){
+                        this.eventReport = true;
+                    }
+                    if(event != EVENT_STATUS_END){
+                        ret = false;
+                    }else{
+                        ret = true;
+                    }
+                    break;
+                case EVENT_STATUS_TIMESHIFT:
+                    if(event == EVENT_STATUS_TIMESHIFT || event == EVENT_STATUS_TIMESHIFTED || event == EVENT_STATUS_BACKLIVE || event == EVENT_STATUS_BACKLIVED || event == EVENT_STATUS_DISPLAY){
+                        this.eventReport = true;
+                    }
+                    if(event == EVENT_STATUS_TIMESHIFT){
+                        ret = false;
+                    }else{
+                        ret = true;
+                    }
+                    break;
+                case EVENT_STATUS_TIMESHIFTED:
+                    if(event == EVENT_STATUS_TIMESHIFTED || event == EVENT_STATUS_BACKLIVE || event == EVENT_STATUS_BACKLIVED || event == EVENT_STATUS_DISPLAY){
+                        this.eventReport = true;
+                    }
+                    if(event == EVENT_STATUS_TIMESHIFT || event == EVENT_STATUS_TIMESHIFTED){
+                        ret = false;
+                    }else{
+                        ret = true;
+                    }
+                    break;
+                case EVENT_STATUS_BACKLIVE:
+                    if(event == EVENT_STATUS_TIMESHIFT || event == EVENT_STATUS_TIMESHIFTED || event == EVENT_STATUS_BACKLIVE || event == EVENT_STATUS_BACKLIVED || event == EVENT_STATUS_DISPLAY){
+                        this.eventReport = true;
+                    }
+                    if(event == EVENT_STATUS_BACKLIVE){
+                        ret = false;
+                    }else{
+                        ret = true;
+                    }
+                    break;
+                case EVENT_STATUS_BACKLIVED:
+                    if(event == EVENT_STATUS_TIMESHIFTED || event == EVENT_STATUS_TIMESHIFT || event == EVENT_STATUS_BACKLIVED || event == EVENT_STATUS_DISPLAY){
+                        this.eventReport = true;
+                    }
+                    if(event == EVENT_STATUS_BACKLIVE || event == EVENT_STATUS_BACKLIVED){
+                        ret = false;
+                    }else{
+                        ret = true;
+                    }
+                    break;
+                case EVENT_STATUS_END:
+                    this.eventReport = true;
+                    ret = true;
+                    break;
+                default:
+                    logWarning("current event status is "+this.currentEventStatus);
+                    this.eventReport = true;
+                    ret = true;
+                    break;
+            }
+
+            logTrace("eventReport:"+this.eventReport+", ret="+ret);
+        }
+
+        return ret;
+    }
+
     /**
      * 私有接口，外部不需要调用此接口。
      */
     onEvent(event_str){
-        //logTrace("player event: "+event_str);
+        logTrace("player event: "+event_str);
         let obj = JSON.parse(event_str);
         let event_obj = JSON.parse(obj.param);
         let event = event_obj.event;
@@ -432,33 +554,42 @@ class JsvBaseMedia {
                 }
                 break;
             case "onEnd":
-                this.local.isRenderable = false;
-                this.setState("paused", true, "boolean");
-                if(this.hasOwnProperty("onend")){
-                    this["onend"]();
+                if(this.needReportEvent(EVENT_STATUS_END)){
+                    this.local.isRenderable = false;
+                    this.setState("paused", true, "boolean");
+                    if(this.hasOwnProperty("onend")){
+                        this["onend"]();
+                    }
+                    this.currentEventStatus = EVENT_STATUS_END;
                 }
                 break;
             case "onLoadStart":
                 logDebug("onLoadStart:"+data);
-                if(this.hasOwnProperty("onloadstart")){
-                    this["onloadstart"]();
+                if(this.needReportEvent(EVENT_STATUS_LOADSTART)){
+                    if(this.hasOwnProperty("onloadstart")){
+                        this["onloadstart"]();
+                    }
+                    this.currentEventStatus = EVENT_STATUS_LOADSTART;
                 }
                 break;
             case "onLoad":
                 logDebug("onLoad:"+data);
-                this.local.currentTime = data.currentTime;
-                this.local.duration = data.duration;
+                if(this.needReportEvent(EVENT_STATUS_LOAD)){
+                    this.local.currentTime = data.currentTime;
+                    this.local.duration = data.duration;
 
-                if (this.hasOwnProperty("onloadedmetadata")) {
-                    this["onloadedmetadata"]();
-                }
+                    if (this.hasOwnProperty("onloadedmetadata")) {
+                        this["onloadedmetadata"]();
+                    }
 
-                if (this.hasOwnProperty("onload")) {
-                    this["onload"]();
-                }
+                    if (this.hasOwnProperty("onload")) {
+                        this["onload"]();
+                    }
 
-                if (this.hasOwnProperty("ondurationchange")) {
-                    this["ondurationchange"]();
+                    if (this.hasOwnProperty("ondurationchange")) {
+                        this["ondurationchange"]();
+                    }
+                    this.currentEventStatus = EVENT_STATUS_LOAD;
                 }
                 break;
             case "onError":
@@ -471,6 +602,7 @@ class JsvBaseMedia {
                         MEDIA_ERR_DECODE: 3,
                         MEDIA_ERR_SRC_NOT_SUPPORTED: 4,
                         MEDIA_ERR_ONLY_ONE_4K: 5,
+                        MEDIA_ERR_NO_DECODE_RESOURCE: 6,
                     };
                     const platform_error = data.error.what;
                     let e = Error.MEDIA_ERR_ABORTED;
@@ -486,15 +618,23 @@ class JsvBaseMedia {
                             break;
                         case -50001:
                             e = Error.MEDIA_ERR_ONLY_ONE_4K;
+                            break;
+                        case -50002:
+                            e = Error.MEDIA_ERR_NO_DECODE_RESOURCE;
+                            break;
+                        default:
+                            break;
                     }
                     this["onerror"](e);
                 }
                 break;
             case "onSeek":
                 logDebug("onSeek:"+data);
-                this.local.isRenderable = false;
-                if(this.hasOwnProperty("onseeking")){
-                    this["onseeking"]();
+                if(this.needReportEvent(EVENT_STATUS_SEEK)){
+                    this.local.isRenderable = false;
+                    if(this.hasOwnProperty("onseeking")){
+                        this["onseeking"]();
+                    }
                 }
                 break;
             case "onEventExt":
@@ -506,9 +646,11 @@ class JsvBaseMedia {
                         }
                         break;
                     case "videoSeekComplete" :
-                        //this.local.isRenderable = true; // waiting until BUFFERING END
-                        if (this.hasOwnProperty("onseeked")) {
-                            this["onseeked"]();
+                        if(this.needReportEvent(EVENT_STATUS_SEEKED)){
+                            //this.local.isRenderable = true; // waiting until BUFFERING END
+                            if (this.hasOwnProperty("onseeked")) {
+                                this["onseeked"]();
+                            }
                         }
                         break;
                     default:
@@ -529,45 +671,64 @@ class JsvBaseMedia {
                 }
                 break;
             case "onPlaybackStalled":
-                this.local.isRenderable = false;
-                if(this.hasOwnProperty("onstalled")){
-                    this["onstalled"]();
+                if(this.needReportEvent(EVENT_STATUS_STALLED)){
+                    this.local.isRenderable = false;
+                    if(this.hasOwnProperty("onstalled")){
+                        this["onstalled"]();
+                    }
                 }
                 break;
             case "onPlaybackResume":
-                this.local.isRenderable = true;
-                if(this.hasOwnProperty("onplaying")){
-                    this["onplaying"]();
+                if(this.needReportEvent(EVENT_STATUS_RESUME)){
+                    this.local.isRenderable = true;
+                    if(this.hasOwnProperty("onplaying")){
+                        this["onplaying"]();
+                    }
                 }
                 break;
             case "onReadyForDisplay":
-                this.local.isRenderable = true;
-                if(this.hasOwnProperty("oncanplay")){
-                    this["oncanplay"]();
+                if(this.needReportEvent(EVENT_STATUS_DISPLAY)){
+                    this.local.isRenderable = true;
+                    if(this.hasOwnProperty("oncanplay")){
+                        this["oncanplay"]();
+                    }
+                    this.currentEventStatus = EVENT_STATUS_DISPLAY;
                 }
                 break;
             case "onTimeShift":
                 logDebug("onTimeShift");
-                if(this.hasOwnProperty("ontimeshift")){
-                    this["ontimeshift"](data.seekTime);
+                if(this.needReportEvent(EVENT_STATUS_TIMESHIFT)){
+                    if(this.hasOwnProperty("ontimeshift")){
+                        this["ontimeshift"](data.seekTime);
+                    }
+                    this.currentEventStatus = EVENT_STATUS_TIMESHIFT;
                 }
                 break;
             case "onTimeShifted":
                 logDebug("onTimeShifted");
-                if(this.hasOwnProperty("ontimeshifted")){
-                    this["ontimeshifted"]();
+                if(this.needReportEvent(EVENT_STATUS_TIMESHIFTED)){
+                    if(this.hasOwnProperty("ontimeshifted")){
+                        this["ontimeshifted"]();
+                    }
+                    this.currentEventStatus = EVENT_STATUS_TIMESHIFTED;
                 }
                 break;
             case "onBackLive":
                 logDebug("onBackLive");
-                if(this.hasOwnProperty("onbacklive")){
-                    this["onbacklive"]();
+                if(this.needReportEvent(EVENT_STATUS_BACKLIVE)){
+                    if(this.hasOwnProperty("onbacklive")){
+                        this["onbacklive"]();
+                    }
+                    this.currentEventStatus = EVENT_STATUS_BACKLIVE;
                 }
                 break;
             case "onBackLived":
                 logDebug("onBackLived");
-                if(this.hasOwnProperty("onbacklived")){
-                    this["onbacklived"]();
+                if(this.needReportEvent(EVENT_STATUS_BACKLIVED)){
+                    if(this.hasOwnProperty("onbacklived")){
+                        this["onbacklived"]();
+                    }
+                    this.currentEventStatus = EVENT_STATUS_BACKLIVED;
                 }
                 break;
             default:
@@ -601,7 +762,7 @@ class JsvBaseMedia {
     set currentTime(value) {
         this.local.isRenderable = false;
         this.local.currentTime = value;
-		this.setState("currentTime", value, "number");
+        this.setState("currentTime", value, "number");
     }
 
     /**
@@ -732,8 +893,9 @@ class JsvBaseMedia {
      * @param {string} head 网络请求的head信息，可以为NULL。
      * @param {int} type 类型，1表示点播，2表示直播，3表示时移，默认1。
      * @param {double} timeShift 时移时间，只有在type=3时才有效，表示从当前时间时移多长时间，单位秒。
+     * @param {int} 分辨率类型。0:unknown或其它；1:标清；2:高清；3:超清（720P）；4:蓝光（1080P）；5:2K；6:4K；7:8K。
      */
-    setSrc(url, head, type, timeShift){
+    setSrc(url, head, type, timeShift, resolution){
         let src = {};
         src.url = url;
         if(head){
@@ -747,7 +909,14 @@ class JsvBaseMedia {
         if(type === 3 && timeShift){
             src.timeShift = timeShift;
         }
+
+        if(resolution && typeof resolution === "number"){
+            src.resolution = resolution;
+        }
+
+        this.currentEventStatus = EVENT_STATUS_NONE;
         this.setState("src", JSON.stringify(src), "string");
+        this.eventReport = true;
     }
 
     /**
@@ -792,10 +961,16 @@ class JsvBaseMedia {
      * 停止视频流。
      */
     unload() {
+        this.unloadPrivate();
+        this.currentEventStatus = EVENT_STATUS_NONE;
+        this.eventReport = true;
+	}
+
+    unloadPrivate(){
         this.setState("paused", true, "boolean");
         this.local.isRenderable = false;
 		this.setState("enablePlayer", false, "boolean");
-	}
+    }
 
     /**
      * 要求终端访问指定的频道，并立即返回。对由本地设置为跳过的频道，也返回-1。
@@ -809,6 +984,15 @@ class JsvBaseMedia {
      */
     joinChannel(mixNo){
         logTrace("joinChannel, key="+this.key+", mixNo="+mixNo);
+        let ret = this.joinChannelPrivate(mixNo);
+        if(ret >= 0){
+            this.currentEventStatus = EVENT_STATUS_NONE;
+            this.eventReport = true;
+        }
+        return ret;
+    }
+
+    joinChannelPrivate(mixNo){
         if(mixNo <= 0){
             return -1;
         }
@@ -821,6 +1005,7 @@ class JsvBaseMedia {
         if(ret >= 0){
             this.channelID = mixNo;
             this.local.paused = false;
+            
             this.setState("paused", false, "boolean");
         }
 
@@ -837,6 +1022,14 @@ class JsvBaseMedia {
      */
     leaveChannel(){
         logTrace("leaveChannel, key="+this.key+", channelID="+this.channelID);
+        let ret = this.leaveChannelPrivate();
+
+        this.currentEventStatus = EVENT_STATUS_NONE;
+        this.eventReport = true;
+        return ret;
+    }
+
+    leaveChannelPrivate(){
         let ret = 0;
         if(this.playerCreate && this.appVisible){
             ret = window.jsvPlayerBridge.leaveChannel(this.key);
@@ -1023,21 +1216,21 @@ class JsvBaseMedia {
 }
 
 class JsvMedia extends JsvBaseMedia {
-    constructor(type, hole_id, player_type, key, background, design_map_width) {
-        super(type, hole_id, player_type, key, background, design_map_width);
+    constructor(type, hole_id, player_type, key, background, design_map_width, decode_type) {
+        super(type, hole_id, player_type, key, background, design_map_width, decode_type);
         //super.buildPlatformInstance(type);
     }
 }
 
 class JsvMediaAudio extends JsvMedia {
     constructor() {
-        super("audio", null, null, null, null, null);
+        super("audio", null, null, null, null, null, 0);
     }
 }
 
 class JsvMediaVideo extends JsvMedia {
-    constructor(hole_id, player_type, key, background, design_map_width) {
-        super("video", hole_id, player_type, key, background, design_map_width);
+    constructor(hole_id, player_type, key, background, design_map_width, decode_type) {
+        super("video", hole_id, player_type, key, background, design_map_width, decode_type);
         
         this.state.aspectRatio = 'origin'; // 'origin', 'full', '16:9', '4:3',
     }
@@ -1078,7 +1271,7 @@ class JsvMediaVideo extends JsvMedia {
 
 /**
  * 获取播放器能力集，当前主要是对4K多播放器的支持以及H265解码能力的支持。
- * @return {string} 能力集数组。
+ * @return {string} json string，能力集JSON数据格式。
  */
 function getJsvPlayerCapabilitySet(){
     if(typeof window.jsvPlayerBridge !== "undefined"){
@@ -1086,12 +1279,29 @@ function getJsvPlayerCapabilitySet(){
     }
 }
 
+/**
+     * 设置指定视频类型的同时使用播放器个数，会check硬件是否支持系统设置的播放器个数，最好在小程序初始化的时候，使用播放器资源之前调用。
+     * @param {string} videoType，对于H264，是video/avc，对于H265，是video/hevc，其他可以参考相关定义。
+     * @param {int} num，需要使用的播放器个数。
+     * @return {String} json string，对设置的播放器个数的支持状态,返回的总数不会大于设置的个数（实际硬件能力可能大于设置的个数）。
+     *                  支持三个属性：1、total：总的播放器个数；2、hardware：硬解播放器个数；3、软解播放器个数，如果硬解播放器个数不满足需求，会根据cpu能力确定是否提供软解播放器。
+     * */
+function setJsvPlayerNumber(videoType, num){
+    logTrace("setPlayerNumber, key="+this.key+", videoType="+videoType+", num="+num);
+    if(typeof window.jsvPlayerBridge !== "undefined"){
+        return window.jsvPlayerBridge.setPlayerNumber(videoType, num);
+    }else{
+        return null;
+    }
+}
+
 export {
     JsvMediaVideo,
     JsvMediaAudio,
     globalLoadJsvPlayerPlugin,
     findMediaObjectByKey,
     getJsvPlayerCapabilitySet,
+    setJsvPlayerNumber,
     setLogLevel,
     logFatal,
     logError,

package/utils/JsViewPlugin/JsvPlayer/JsvPlayer.vue

@@ -22,6 +22,10 @@ export default {
 		 * 属性，int类型，底层使用的播放器类型。1：系统播放器；2:jsv播放器。默认2。
 		 */
 		playerType: {type: Number, default: 2},
+		/**
+		 * 属性，int类型，播放器解码方式。0：根据硬件能力自动匹配；1:硬解码；2:软解码。默认0（根据芯片能力自动匹配）。
+		 */
+		decodeType: {type: Number, default: 0},
 		/**
 		 * 属性，Boolean类型，层级关系，true表示在界面的下面，false表示在界面上面，默认true。
 		 */
@@ -222,7 +226,7 @@ export default {
 		let first_create = true;
 
 		if(!this.video){
-			this.video = new JsvMediaVideo(this.holeId, player_type, key, background, designMap.width);
+			this.video = new JsvMediaVideo(this.holeId, player_type, key, background, designMap.width, this.decodeType);
 		}else{
 			this.video.setRef();
 			first_create = false;

package/utils/JsViewPlugin/JsvPlayer/version.js

@@ -1,17 +1,17 @@
 let PluginInfo={
-    //downloadUrl:"http://192.168.0.37:8080/plugin/JsvPlayer-6.0.zip", //插件下载地址
+    // downloadUrl:"http://192.168.0.34:8080/plugin/JsvPlayer-160.dat", //插件下载地址
     packageName:"com.qcode.jsvplayer",
     name:"播放器插件",
-    version:"1.5.0",  //插件需要的版本号
-    versionCodeMin:150,
-    versionCodeMax:150,
+    version:"1.6.2",  //插件需要的版本号
+    versionCodeMin:162,
+    versionCodeMax:162,
     bridgeName:"jsvPlayerBridge", //插件bridge注册到jsview的名称
     className:"com.qcode.jsvplayer.JsvPlayer",  //插件初始化类名称
     initMethod:"createInstance",   //插件初始化方法
     listener:"top.JsvPlayerPluginLoadResult",  //插件加载结果回调
     listener2: "top.JsvPlayerPluginStatus",
     // debug:true,
-    md5:"b0d74cbeafdb0adb02862addf61ce9d3"
+    md5:"3efdfaa94325d7dbf81ae80fb4834143"
 };
 
 // 不要用export default，update-env脚本不能解析

package/utils/JsViewVueTools/JsvRefTaker.js

@@ -0,0 +1,35 @@
+
+/********************
+ * JsvRefTaker模块
+ * 
+ * 用于解决 script setup 写法，不容易通过 this.$ref.xxxx 拿到子模块的句柄，
+ * 但使用ref(null)的方式构筑的深度reactive对象又会严重影响element的内部处理性能的问题
+ * 
+ * 使用方法:
+ * <script setup>
+ * const element_ref = buildTaker();
+ * 
+ * onMounted(()=>{
+ *     // onMounted以后，可以用 .current 访问到引用
+ *     console.log(element.current)
+ * })
+ * </script>
+ * 
+ * <template>
+ *     <div :ref="element_ref.fnc" />
+ * </template>
+ * 
+ ********************/
+
+function buildTaker() {
+    let pack = {
+        fnc: null,
+        current: null
+    }
+    pack.fnc = (r)=>{
+        pack.current = r;
+    }
+    return pack;
+}
+
+export default buildTaker;

package/utils/JsViewVueTools/index.js

@@ -0,0 +1,19 @@
+/*
+ * @Author: ChenChanghua
+ * @Date: 2022-07-05 14:09:55
+ * @LastEditors: ChenChanghua
+ * @LastEditTime: 2022-07-06 11:03:34
+ * @Description: file content
+ */
+
+export * from "./JsvHashHistory";
+export * from "./JsvDynamicCssStyle.js";
+export * from "./JsvDynamicKeyFrames.js";
+export * from "./JsvRuntimeBridge.js";
+export * from "./NinePatchHelper";
+export * from "./TypeCheckAndSet";
+export * from "./JsvRefTaker.js";
+export * from "./JsvStyleClass.js";
+export * from "./DebugContentShellJBridge.js";
+export * from "./DebugTool.js";
+export { default as DefaultKeyCodeMap } from "./DefaultKeyMap.js";

package/utils/JsViewVueWidget/BrowserDebugWidget/BrowserQrcode.vue

@@ -18,11 +18,15 @@ export default {
         },
         imageSettings: Object
     },
-    data() {
+    setup() {
         return {
             imageStyle: null,
+            qrcodeRes: null,
         }
     },
+    created() {
+        this.qrcodeRes = this.renderQrcode();
+    },
     methods: {
         convertStr(str) {
             let out = "";
@@ -149,10 +153,10 @@ export default {
             :shapeRendering="'crispEdges'"
             :height="size"
             :width="size"
-            :viewBox="'0 0 ' + renderQrcode().numCells + ' ' + renderQrcode().numCells"
+            :viewBox="'0 0 ' + qrcodeRes.numCells + ' ' + qrcodeRes.numCells"
         >
-            <jsve-path :fill="bgColor" :d="'M0,0 h' + renderQrcode().numCells + 'v' + renderQrcode().numCells + 'H0z'" />
-            <jsve-path :fill="fgColor" :d="renderQrcode().fgPath" />
+            <jsve-path :fill="bgColor" :d="'M0,0 h' + qrcodeRes.numCells + 'v' + qrcodeRes.numCells + 'H0z'" />
+            <jsve-path :fill="fgColor" :d="qrcodeRes.fgPath" />
         </jsve-svg>
         <div :style="imageStyle"></div>
     </div>