HBuilder

8.8.0.201706142254

当前版本，我机器配置比较低。win10，系统
hb打开时间长了的话。点击左下角的状态栏，调不出开关机那个状态栏。
今天无意间安装了一下tx的安全管家，竟然不卡了。。。特此通报。
本人懒，打这么多字实属不易。就别挑剔逻辑问题了。看我的东西，主要意会。~~

--

使用银联wap支付很简单
见如下代码：
银联结果返回页面

<script type="text/javascript">   
            var ws;       
            // H5 plus事件处理  
            function plusReady() {                
                ws = plus.webview.currentWebview();  
                var re_vw = plus.webview.getWebviewById("recharge.html");  
                re_vw.evalJS('yl_res("<?php echo $_POST ['orderId'];?>")');   
                ws.close();  
            }  

            if(window.plus) {  
                plusReady();  
            } else {  
                document.addEventListener("plusready", plusReady, false);  
            }             
        </script>

app需要通知的页面

function yl_res(orderno){  
    mui.getJSON(api,{act:'recharge_result',orderno:orderno,user_phone:user_phone},function(data){  
        if(data.data.status==1){  
            mui.toast("充值成功");  
            userin("wallet.html");  
        }  
    });  
}

只有打包后 安装 才能体现启动页改变
如果只是手机调试运行 启动页确实没有改变

swiper在里面滚动效果演示地址 http://www.swiper.com.cn/demo/99-inner-scroll.html
基于mui的区域滚动组件以及滑动事件实现组件
组件css代码
/分屏切换组件CSS/
.mui-scroll-splitScreen{
position: relative;
overflow: hidden;
}
.mui-scroll-splitScreen-group{
position: relative;
width: 100%;
height: 100%;
transition: all 0.5s;
}
.mui-scroll-splitScreen .mui-scroll-wrapper{
position: relative;
height: 100%;
width: 100%;
}
.mui-scroll-splitScreen .mui-scroll-wrapper .mui-scroll{
padding-bottom: 40px;
min-height: 100%;
}
.mui-scroll-splitScreen .mui-scroll-wrapper .slide-up-msg{
text-align: center;
opacity: 0;
height: 40px;
line-height: 40px;
position: absolute;
bottom: 0;
left: 0;
width: 100%;
}
.mui-scroll-splitScreen .mui-scroll-wrapper[swipeupmore=yes] .slide-up-msg{
opacity: 1;
}
.mui-scroll-splitScreen .mui-scroll-wrapper[swipeupmore=yes1] .slide-up-msg{
opacity: 1;
}
/分屏切换组件CSS/

组件JS代码
//分屏切换组件功能代码
function splitScreenSlide(Json){
var _this=this;
var el=Json.el;
var slideUpMsg=Json.slideUpMsg || '上拉显示更多';
var $group=document.querySelector(el+' .mui-scroll-splitScreen-group');
var $wrapper=document.querySelectorAll(el+' .mui-scroll-wrapper');
this.initInsideScroll=function(){
//判断每屏内容是否超出，如果超出不启用滑动两次切屏效果，直接滑动一次切屏
for(var i=0;i<$wrapper.length;i++){
var $scroll=$wrapper[i].getElementsByClassName('mui-scroll')[0];
if($scroll.clientHeight<=$wrapper[i].clientHeight){
console.log(1);
$wrapper[i].setAttribute('swipeupMore','yes1');
$wrapper[i].setAttribute('swipedownMore','yes1');
}else{
$wrapper[i].setAttribute('swipeupMore','no');
$wrapper[i].setAttribute('swipedownMore','no');
}
}
}
this.goToSlideItem=function(index){
//跳转到指定屏，从0开始
$group.style.transform='translateY(-'+index100+'%)';
_this.initInsideScroll();
}
this.restoreEl=function(){
//复原组件
$group.style.transform='translateY(0)';
_this.initInsideScroll();
}
//组件生成代码
for(var i=0;i<$wrapper.length;i++){
//添加提示
var oP=document.createElement('p');
oP.className='slide-up-msg';
if(i==$wrapper.length-1){
$wrapper[i].endWrapper=true;
oP.innerHTML='没有更多内容了！';
}else{
oP.innerHTML=slideUpMsg;
}
$wrapper[i].appendChild(oP);
//添加索引下标
$wrapper[i].index=i;
//添加监听事件
$wrapper[i].addEventListener('swipeup',function(){
var xx=mui(this).scroll();
if(xx.y<=xx.maxScrollY){
if(this.endWrapper==true){
this.setAttribute('swipeupMore','yes');
this.setAttribute('swipedownMore','no');
return false;
}
if(this.getAttribute('swipeupMore')=='yes' || this.getAttribute('swipeupMore')=='yes1'){
if(this.getAttribute('swipeupMore')!='yes1'){
this.setAttribute('swipeupMore','no');
this.setAttribute('swipedownMore','no');
}
var x=(this.index+1)100;
$group.style.transform='translateY(-'+x+'%)';
}else{
this.setAttribute('swipeupMore','yes')
this.setAttribute('swipedownMore','no');
}
}
})
$wrapper[i].addEventListener('swipedown',function(){
var xx=mui(this).scroll();
if(xx.y>=0){
if(this.getAttribute('swipedownMore')=='yes' || this.getAttribute('swipedownMore')=='yes1'){
if(this.getAttribute('swipedownMore')!='yes1'){
this.setAttribute('swipedownMore','no');
this.setAttribute('swipeupMore','no');
}
var x=(this.index-1)*100;
$group.style.transform='translateY(-'+x+'%)';
}else{
this.setAttribute('swipedownMore','yes')
this.setAttribute('swipeupMore','no');
}
}
})
}
this.initInsideScroll();
}
使用方法 HTML代码
<div class="mui-scroll-splitScreen">
<div class="mui-scroll-splitScreen-group">
<div class="mui-scroll-wrapper">
<div class="mui-scroll">
第一屏 内容
</div>
</div>
<div class="mui-scroll-wrapper">
<div class="mui-scroll">
第二屏 内容
</div>
</div>
<div class="mui-scroll-wrapper">
<div class="mui-scroll">
第三屏 内容
</div>
</div>
</div>
</div>
JS初始化代码
mui.init({
gestureConfig:{
tap: true, //默认为true
doubletap: true, //默认为false
longtap: true, //默认为false
swipe: true, //默认为true
drag: true, //默认为true
hold:false,//默认为false，不监听
release:false//默认为false，不监听
}
});
mui('.mui-scroll-wrapper').scroll({
indicators:true
});
//实例化组件
var mSplitScreen=new splitScreenSlide({
el:'.mui-scroll-splitScreen'
});

附件有实例代码需要引用mui.css 和mui.js

解决方法:
开了原生naitive模式header，
检查manifest.json中，是否设置了plus->launchwebview->navigationbar | titleNView。
去掉黄色标识代码。

var clearStateAndToLogin = function() {
settings.gestures = '';
settings.autoLogin = false;
app.setSettings(settings);
var state = app.getState();
state.token = '';
app.setState(state);
// $.openWindow({
// url: 'login.html',
// id: 'login',
// show: {
// aniShow: 'pop-in'
// },
// waiting: {
// autoShow: false
// }
// });
plus.webview.getLaunchWebview().show("pop-in", 200, function() {
plus.webview.currentWebview().close("none");
});
};

HTML5 app中设置手势，打开应用时检测是否设置手势，若忘记手势重新登录时遇到登录不了的问题，由于官方的做法open一个登录页面，但是login是属于预加载页面，重新打开的页面是无法登录，这时需要打开之前预加载的登录页，才能登录成功，这项目的入口文件为login页，所以可以直接通过getLaunchWebview()这个方法打开。

https://ask.dcloud.net.cn/article/783

按值传递（call by value）是最常用的求值策略：函数的形参是被调用时所传实参的副本。修改形参的值并不会影响实参。
按引用传递（call by reference）时，函数的形参接收实参的隐式引用，这意味着函数形参的值如果被修改，实参也会被修改。同时两者指向相同的值。

按引用传递会使函数调用的追踪更加困难，有时也会引起一些微妙的bug。

按值传递由于每次都需要克隆副本，对一些复杂类型，性能较低。两种传递方式都有各自的问题。
js的基本类型是按值传递的。（基本类型：string、boolean、）
var a = 1；
function foo（x）{
x =2;
}
foo(a);
console.log(a);//仍为1，未受x = 2赋值所影响

再来看看对象传值：（对象类型：obj，array）
var obj = {x ：1};
function foo(ob){
ob.x = 3;}
foo(obj);
console.log(obj.x);//3,被修改了！
var obj = {x ： 1}；
function foo(ob){
ob = 100;
}
foo(obj);
console.log(obj.x);//仍然是1，obj未被修改为100.

可以看出，对象的传值并不是按引用传递。其实，按共享传递call by sharing，准确的说，js中的基本类型按值传递，对象类型按共享传递的，也叫按对象传递、按对象共享传递。该求值策略被用于python/java/puby/js等多种语言。
该策略（按对象传递、按对象共享传递）的重点是：调用函数传参时，函数接受对象实参引用的副本（既不是按值传递的对象副本，也不是按引用传递的隐式引用）。它和按引用传递的不同在于：在共享传递中对函数形参的赋值，不会影响实参的值。代码如下；

var obj = {x ： 1}；
function foo(ob){
ob = 100;
}
foo(obj);
console.log(obj.x);//仍然是1，obj未被修改为100.

然而，虽然引用是副本，引用的对象是相同的。他们共享相同的对象，所以修改形参对象的属性值，也会影响到实参的属性值。如下：
var obj = {x ：1};
function foo(ob){
ob.x = 3;}
foo(obj);
console.log(obj.x);//3,被修改了！

按引用传递相当于一个是有名字的框，框里有各种各样的东西（对象）。框可以有不同的名字，但里面的内容还是同一个内容。相当于有了两把钥匙。

对于对象类型，由于对象是可变mutable的，修改对象本身会影响到共享这个对象的引用和引用副本。

而对于基本类型，由于他们都是不可变immutable的，按共享传递与按值传递没有任何区别，所以说js基本类型既符合按值传递，也符合共享传递。
var a = 1; // 1是number类型，不可变 var b = a; b = 6;

据按共享传递的求值策略，a和b是两个不同的引用(b是a的引用副本)，但引用相同的值。由于这里的基本类型数字1不可变，所以这里说按值传递、按共享传递没有任何区别。

基本类型的不可变(immutable)性质
基本类型是不可变的(immutable)，只有对象是可变的(mutable). 例如数字值100, 布尔值true, false，修改这些值(例如把1变成3, 把true变成100)并没有什么意义。比较容易误解的，是JS中的string。有时我们会尝试“改变”字符串的内容，但在JS中，任何看似对string值的”修改”操作，实际都是创

建新的string值。代码如下：
var str = “abc”;
str[0];//"a"
str[0] = "d";
str;//仍然是“abc”，赋值时无效的。没有任何办法修改字符串的内容
而对象就不一样了，对象是可变的。代码如下：
var obj = {x:1};
obj.x = 100;
var ob = obj;
ob.x = 1;
obj.x;//1,被修改
ob = true;
obj.x;//1,不会因ob = true改变。
这里定义变量obj，值是object，然后设置obj.x的属性值为100.而后定义另一个变量ob，值仍然是这个object对象，此时obj和ob两个变量指向同一个对象（共享同一个对象的引用）。所以修改对象的内容，对obj和ob都有影响。但对象并非按引用传递，通过ob=true修改了ob的值，不会影响obj。

    总之，基本类型是按值传递，而对于对象来说传入的是对象指向的地址，也可以认为其是特殊的按值传递。如果在函数内对象的属性进行操作，实际就是对其指向对象的属性进行操作。但是，如果对其整体进行操作（比如：ob = 100或者ob = 【】），其实际是新定义了对象，实参的引用地址为新的对象的引用地址，与原来的引用没有任何关系，所以不会对原来的对象造成改变。  

传递的两种类型：
1.按值传递：string number boolean 基本类型，变量创建了一个新的内存副本，改变形参并不会修改实参的值。
2.按引用传递：object array 对象类型，对象指向同一个地址，就是内存地址，可以类比为门牌号，对象类型的值是地址而不是真正对象本身。可直接修改实参的值。
参考：http://www.jb51.net/article/60568.htm

时隔一年多，我对这个框架还是有点迷迷糊糊，希望记录一些对自己也对大家有帮助的东西

native.js，这玩意就是对android原生一些接口方法的封装，可以理解为讲原生的java类和js的类对应起来，这样就可以在js里面调用java的代码了。这么说还是有点模糊，换个说法，官方把android的类封装好了，然后创建了一个js库，只要创建js对应的android类就可以调用原生的android类和方法，注意！！！只能是android原生存在的，他实际应该算是映射的

而5+ sdk，则是需要离线打包，相当于（从根本上就是）自己写一个类，然后用js去调用，和上面的区别在于这里类是可以自己实现，并不是android内部原生的类

native :js<---->映射<---->android原生类
5+sdk :js<--->桥<--->自己实现的类

有关效率
http://ask.dcloud.net.cn/question/4142
楼中有位哥们儿给出了答案，5+sdk效率更高些，js仅作信息传递用，java部分运行java的
之前native实现表达确实不清楚，这里的映射本质应该也是桥，不过为了做区分就不改了

h5模式下的选择日期时间选择器，安卓显示正常，ios文字正常，数字模糊，如图

解决方案：
在你自己的css里面加一句
.mui-ios .mui-dtpicker-body {
perspective: none!important;
transform-style: flat!important;
-webkit-perspective:none!important;
-webkit-transform-style:flat!important;
}
如果你的css放在picker.css后面，可以去掉！important；
希望能帮到各位老铁~