mui picker選擇器動態賦值不成功

後端使用thinkphp6框架，查詢數據，按照需求封裝成前端需要的json數組格式，原始數據如下：

開始處理數據： 

public function index(){        
    $industry = industry(); //行業詳情 ，查詢出來的數據，如上面的二維數組    
    $arr = array(); //空數組 用於存儲前臺需要的數據
    foreach($industry as $k=>$v) { //拼接前臺需要的數據
         $arr[$k]['value'] = $v['t_id']; 
         $arr[$k]['text'] = $v['t_name'];
    }
     
    return view('index',[
        'carousel' => carousel(), //輪播圖
        'industryStr' => urldecode(json_encode($arr)), //行業詳情 ，將處理好的數據變成 json 傳遞，因爲這裏數組中包含中文，所以需要使用 urldecode() 處理一下
    ]);
}

處理好的數據如下：

[{"value":1,"text":"\u4e92\u8054\u7f51"},{"value":2,"text":"\u901a\u4fe1"},{"value":3,"text":"\u7535\u5b50"},{"value":4,"text":"\u91d1\u878d"},{"value":5,"text":"\u94f6\u884c"},{"value":6,"text":"\u4fdd\u9669"}]

這裏我發現，如果將上面的json數組使用靜態方法直接賦值給mui的選擇器是可以直接使用的，但是我用動態賦值的方法則不行，不光是不行，連值我都打印不出來，後來我估計應該是數據有問題，導致js都失效了，後來改了一種寫法，將得到的數據輸出在html頁面，然後使用js去拿數據，並使用$.parseJSON( )處理數據：

<!-- html 代碼 -->
<div id="industryStr" style="display: none">{$industryStr}</div>
<div class="search-left">
    <a href="JavaScript:;" onclick="selecteds()">
       <span id="industry">選擇行業</span>
       <span class="mui-icon mui-icon-arrowdown"></span>
   </a>
</div>

//js代碼
function selecteds() {
    var picker = new mui.PopPicker();
    var arr = $("#industryStr").text(); //獲取 json 
    picker.setData($.parseJSON(arr)); //處理 json
    picker.show(function (selectItems) {
        $("#industry").html(selectItems[0].text);
        console.log(selectItems[0].value);
    })
} 

最終效果：