HBuilderX

HBuilderX

极客开发工具
uni-app

uni-app

开发一次,多端覆盖
uniCloud

uniCloud

云开发平台
HTML5+

HTML5+

增强HTML5的功能体验
MUI

MUI

上万Star的前端框架

关于mui-slider当分类标题是ajax加载的时候,移动到后面分类的无法无法自动滚动解决办法

slider

注意,我的问题不是说ajax加载出的分类不滑动了,而是滚动的时候不能自动定位。废话不多放,上图:


注意看一下,当我移到后面的时候菜单名称就不出来了,只有鼠标点击才出来。
关于:http://dev.dcloud.net.cn/mui/ui/#gallery 这里说的解决办法:
注意:mui框架会默认初始化当前页面的图片轮播组件;若轮播组件内容为js动态生成时(比如通过ajax动态获取的营销信息),则需要在动态生成完整DOM (包含mui-slider下所有DOM结构) 后,手动调用图片轮播的初始化方法;代码如下:

//获得slider插件对象  
var gallery = mui('.mui-slider');  
gallery.slider({  
  interval:5000//自动轮播周期,若为0则不自动播放,默认为0;  
});

试了并没有用,这个只能解决ajax拉数据后不能滚动的问题。

找了半天,看到mui框架里这段注释了(在代码的4837行,我用的版本是:v3.7.0 ):

    $.ready(function() {  
        //      setTimeout(function() {  
        $('.mui-slider').slider();  
        $('.mui-scroll-wrapper.mui-slider-indicator.mui-segmented-control').scroll({  
            scrollY: false,  
            scrollX: true,  
            indicators: false,  
            snap: '.mui-control-item'  
        });  
        //      }, 500); //临时处理slider宽度计算不正确的问题(初步确认是scrollbar导致的)  

    });

原来作者也找到这个问题了,还用了了临时的解决办法。是用的settimeout。可能考虑到影响整体效率又去掉了,这里我鄙视你一下。
我的解决办法
首先把这一段整体注释掉

    $.ready(function() {  
        //setTimeout(function() {  
        /*这里把默认的滚动去掉了,因为如果菜单是ajax调用的话,横向滚动无法自动移位  
        $('.mui-slider').slider();  
        $('.mui-scroll-wrapper.mui-slider-indicator.mui-segmented-control').scroll({  
            scrollY: false,  
            scrollX: true,  
            indicators: false,  
            snap: '.mui-control-item'  
        });*/  
        //      }, 500); //临时处理slider宽度计算不正确的问题(初步确认是scrollbar导致的)  
    });

然后在要用到slider的地方动态调用:

export default {  
    components:{  
        listData,  
    },    
    data(){  
        return{  
            catList:[],  
        }  
    },    
    methods:{  
        //栏目列表  
        getCatData:function(){  
            var obj=this;  
            this.$axios.get("/Cat/index/ajax/1/modelid/3/").then(function(response){  
                var data=response.data.info.data;  
                var count=response.data.info.count;  
                obj.catList=data;  
            })  
        },  
    },  
    mounted() {  
        //获取-栏目列表  
        this.getCatData();  
    },  
    updated:function(){  
        //mui切换  
        var slider=this.mui('.mui-slider');  
        slider.slider();  
    }     
}

我用的是vue框架开发的,如果你是用ajax的在你ajax拉出来后调用slider就可以了:

        var slider=this.mui('.mui-slider');  
        slider.slider();

看下成功后的效果吧:

继续阅读 »

注意,我的问题不是说ajax加载出的分类不滑动了,而是滚动的时候不能自动定位。废话不多放,上图:


注意看一下,当我移到后面的时候菜单名称就不出来了,只有鼠标点击才出来。
关于:http://dev.dcloud.net.cn/mui/ui/#gallery 这里说的解决办法:
注意:mui框架会默认初始化当前页面的图片轮播组件;若轮播组件内容为js动态生成时(比如通过ajax动态获取的营销信息),则需要在动态生成完整DOM (包含mui-slider下所有DOM结构) 后,手动调用图片轮播的初始化方法;代码如下:

//获得slider插件对象  
var gallery = mui('.mui-slider');  
gallery.slider({  
  interval:5000//自动轮播周期,若为0则不自动播放,默认为0;  
});

试了并没有用,这个只能解决ajax拉数据后不能滚动的问题。

找了半天,看到mui框架里这段注释了(在代码的4837行,我用的版本是:v3.7.0 ):

    $.ready(function() {  
        //      setTimeout(function() {  
        $('.mui-slider').slider();  
        $('.mui-scroll-wrapper.mui-slider-indicator.mui-segmented-control').scroll({  
            scrollY: false,  
            scrollX: true,  
            indicators: false,  
            snap: '.mui-control-item'  
        });  
        //      }, 500); //临时处理slider宽度计算不正确的问题(初步确认是scrollbar导致的)  

    });

原来作者也找到这个问题了,还用了了临时的解决办法。是用的settimeout。可能考虑到影响整体效率又去掉了,这里我鄙视你一下。
我的解决办法
首先把这一段整体注释掉

    $.ready(function() {  
        //setTimeout(function() {  
        /*这里把默认的滚动去掉了,因为如果菜单是ajax调用的话,横向滚动无法自动移位  
        $('.mui-slider').slider();  
        $('.mui-scroll-wrapper.mui-slider-indicator.mui-segmented-control').scroll({  
            scrollY: false,  
            scrollX: true,  
            indicators: false,  
            snap: '.mui-control-item'  
        });*/  
        //      }, 500); //临时处理slider宽度计算不正确的问题(初步确认是scrollbar导致的)  
    });

然后在要用到slider的地方动态调用:

export default {  
    components:{  
        listData,  
    },    
    data(){  
        return{  
            catList:[],  
        }  
    },    
    methods:{  
        //栏目列表  
        getCatData:function(){  
            var obj=this;  
            this.$axios.get("/Cat/index/ajax/1/modelid/3/").then(function(response){  
                var data=response.data.info.data;  
                var count=response.data.info.count;  
                obj.catList=data;  
            })  
        },  
    },  
    mounted() {  
        //获取-栏目列表  
        this.getCatData();  
    },  
    updated:function(){  
        //mui切换  
        var slider=this.mui('.mui-slider');  
        slider.slider();  
    }     
}

我用的是vue框架开发的,如果你是用ajax的在你ajax拉出来后调用slider就可以了:

        var slider=this.mui('.mui-slider');  
        slider.slider();

看下成功后的效果吧:

收起阅读 »

关于学习氛围

因朋友介绍了解这个平台这个框架,感觉挺不错的样子;
然而加入官方群,里面各种乱象,一大堆各种闲人各种不相干技术问题各种闲聊,各种垃圾图片横飞,想看看技术相关问题解答(说不定以后会用得上),这种现象严重影响其他人的学习,影响管理人员查看问题。

建议加强管理群员聊天情况,净化技术交流空间,只作技术交流,促进社区良好的学习氛围!!!

忘官方重视~!!!!!

继续阅读 »

因朋友介绍了解这个平台这个框架,感觉挺不错的样子;
然而加入官方群,里面各种乱象,一大堆各种闲人各种不相干技术问题各种闲聊,各种垃圾图片横飞,想看看技术相关问题解答(说不定以后会用得上),这种现象严重影响其他人的学习,影响管理人员查看问题。

建议加强管理群员聊天情况,净化技术交流空间,只作技术交流,促进社区良好的学习氛围!!!

忘官方重视~!!!!!

收起阅读 »

Android 调用原生socket

Android市场 socket

uni-app 调用原生socket实现与WiFi设备的直连通讯。

网上查阅了一下,关于相关方面的案例略少,借鉴了本论坛中一贴中的测试案例,在此表示感谢。CTRL+C +V 实现了demo app的socket的通讯。
也是使用java nio的轮询io非阻塞式来实现io读写。
本案例是测试demo,有什么不足,请各位指教,谢谢。

var inetSocketAddress = plus.android.importClass("java.net.InetSocketAddress");  
var ByteBuffer = plus.android.importClass("java.nio.ByteBuffer");  
var SelectionKey = plus.android.importClass("java.nio.channels.SelectionKey");  
var Selector = plus.android.importClass("java.nio.channels.Selector");  
var SocketChannel = plus.android.importClass("java.nio.channels.SocketChannel");  
var Iterator = plus.android.importClass("java.util.Iterator");  
var An_String = plus.android.importClass("java.lang.String");  

var StrictMode = plus.android.importClass("android.os.StrictMode");  
var Build = plus.android.importClass("android.os.Build");  
if (Build.VERSION.SDK_INT > 9) {  
    var policy = new StrictMode.ThreadPolicy.Builder().permitAll().build();  
    StrictMode.setThreadPolicy(policy);  
}  

var An_Selector = new Selector();  
var An_SocketChannel = new SocketChannel();  
var An_SelectionKey = new SelectionKey();  

var selector = null;  
var channel = null;  
var stop = false;   //进程控制  

try {  

    channel = An_SocketChannel.open();  
    //设置通道为非阻塞  
    channel.configureBlocking(false);  
    selector = An_Selector.open();  
    channel.connect(new inetSocketAddress("192.168.2.245", 6000));  
    channel.register(selector, An_SelectionKey.OP_CONNECT);  

    while (!stop) {  
        selector.select(1000);  

        var keys = selector.selectedKeys();  
        plus.android.importClass(keys);  
        var ite = keys.iterator();  
        plus.android.importClass(ite);  

        while (ite.hasNext()) {  
            An_SelectionKey = ite.next();  
            ite.remove();  

            if (An_SelectionKey.isConnectable()) {  
                if (channel.isConnectionPending()) {  
                    if (channel.finishConnect()) {  
                        if (channel.isConnected()) {  
                            // 设置成非阻塞  
                            channel.configureBlocking(false);  
                            //在和服务端连接成功之后,为了可以接收到服务端的信息,需要给通道设置读的权限。  
                            channel.register(selector, An_SelectionKey.OP_READ);  
                        }  
                    }  
                }  
            } else if (An_SelectionKey.isReadable()) {  
                // 检测到服务端的数据  
                var buffer = ByteBuffer.allocate(100);  
                var ret = channel.read(buffer);  
                if (ret == -1) {  
                    stop = true;  
                    console.log("server is unconnected");  
                } else {  
                    var data = buffer.array();  
                    var msg = new An_String(data).trim();  
                    console.log("client recive msg : " + msg);  
                    // 发送数据给客户端  
                    var data = new An_String("Im app " + msg);  
                    var outBuffer = new ByteBuffer.wrap(data.getBytes());  
                    channel.write(outBuffer);  
                    if ("by" == msg) {  
                        stop = true  
                    }  
                }  
            }  
        }  
    }  
} catch (e) {  
    console.log("run error : " + e)  
} finally {  
    try {  
        channel.close();  
    } catch (e) {  
        console.log("close error " + e);  
    }  
}
继续阅读 »

uni-app 调用原生socket实现与WiFi设备的直连通讯。

网上查阅了一下,关于相关方面的案例略少,借鉴了本论坛中一贴中的测试案例,在此表示感谢。CTRL+C +V 实现了demo app的socket的通讯。
也是使用java nio的轮询io非阻塞式来实现io读写。
本案例是测试demo,有什么不足,请各位指教,谢谢。

var inetSocketAddress = plus.android.importClass("java.net.InetSocketAddress");  
var ByteBuffer = plus.android.importClass("java.nio.ByteBuffer");  
var SelectionKey = plus.android.importClass("java.nio.channels.SelectionKey");  
var Selector = plus.android.importClass("java.nio.channels.Selector");  
var SocketChannel = plus.android.importClass("java.nio.channels.SocketChannel");  
var Iterator = plus.android.importClass("java.util.Iterator");  
var An_String = plus.android.importClass("java.lang.String");  

var StrictMode = plus.android.importClass("android.os.StrictMode");  
var Build = plus.android.importClass("android.os.Build");  
if (Build.VERSION.SDK_INT > 9) {  
    var policy = new StrictMode.ThreadPolicy.Builder().permitAll().build();  
    StrictMode.setThreadPolicy(policy);  
}  

var An_Selector = new Selector();  
var An_SocketChannel = new SocketChannel();  
var An_SelectionKey = new SelectionKey();  

var selector = null;  
var channel = null;  
var stop = false;   //进程控制  

try {  

    channel = An_SocketChannel.open();  
    //设置通道为非阻塞  
    channel.configureBlocking(false);  
    selector = An_Selector.open();  
    channel.connect(new inetSocketAddress("192.168.2.245", 6000));  
    channel.register(selector, An_SelectionKey.OP_CONNECT);  

    while (!stop) {  
        selector.select(1000);  

        var keys = selector.selectedKeys();  
        plus.android.importClass(keys);  
        var ite = keys.iterator();  
        plus.android.importClass(ite);  

        while (ite.hasNext()) {  
            An_SelectionKey = ite.next();  
            ite.remove();  

            if (An_SelectionKey.isConnectable()) {  
                if (channel.isConnectionPending()) {  
                    if (channel.finishConnect()) {  
                        if (channel.isConnected()) {  
                            // 设置成非阻塞  
                            channel.configureBlocking(false);  
                            //在和服务端连接成功之后,为了可以接收到服务端的信息,需要给通道设置读的权限。  
                            channel.register(selector, An_SelectionKey.OP_READ);  
                        }  
                    }  
                }  
            } else if (An_SelectionKey.isReadable()) {  
                // 检测到服务端的数据  
                var buffer = ByteBuffer.allocate(100);  
                var ret = channel.read(buffer);  
                if (ret == -1) {  
                    stop = true;  
                    console.log("server is unconnected");  
                } else {  
                    var data = buffer.array();  
                    var msg = new An_String(data).trim();  
                    console.log("client recive msg : " + msg);  
                    // 发送数据给客户端  
                    var data = new An_String("Im app " + msg);  
                    var outBuffer = new ByteBuffer.wrap(data.getBytes());  
                    channel.write(outBuffer);  
                    if ("by" == msg) {  
                        stop = true  
                    }  
                }  
            }  
        }  
    }  
} catch (e) {  
    console.log("run error : " + e)  
} finally {  
    try {  
        channel.close();  
    } catch (e) {  
        console.log("close error " + e);  
    }  
}
收起阅读 »

uniapp 自定义导航栏更改状态栏颜色

沉浸式状态栏 uniapp

在设置了自定义的状态栏之后,状态栏的手机端上面状态栏的默认颜色为白色,更改方法为,在pages.json文件里里面,做出如下修改
"style":{
"app-plus":{
"statusbar":{
"background":"#ffffff"
}
}
}
但是修改完成之后,状态栏就会有高度,这样地话,就不需要在页面添加某个view高度为状态栏的高度了
但是还有有点懵逼,这个属性不是状态栏为沉浸式状态栏才能用的么?而且我是自定义的导航栏,不是文档里面写得是自定义的navignateStyle
会撑到导航栏里面去的么?为什么设置了状态栏的颜色之后就不会去里面了?求官方解答

继续阅读 »

在设置了自定义的状态栏之后,状态栏的手机端上面状态栏的默认颜色为白色,更改方法为,在pages.json文件里里面,做出如下修改
"style":{
"app-plus":{
"statusbar":{
"background":"#ffffff"
}
}
}
但是修改完成之后,状态栏就会有高度,这样地话,就不需要在页面添加某个view高度为状态栏的高度了
但是还有有点懵逼,这个属性不是状态栏为沉浸式状态栏才能用的么?而且我是自定义的导航栏,不是文档里面写得是自定义的navignateStyle
会撑到导航栏里面去的么?为什么设置了状态栏的颜色之后就不会去里面了?求官方解答

收起阅读 »

多多客DOODOOKE 1.x升级2.x指南

支付宝小程序 微信小程序 小程序

温馨提示

本教程是1.x升级2.x手动升级指南。由于本次更新涉及到主框架更新,因此本次更新先提供手动升级指南。后续根据情况再进行推送升级。

| 2.x版本引入了npm包管理工具lerna,系统主要是有2个目录,一个是app目录,存放模块。另外一个是plugin目录,存放插件。

目录结构(重要)

javascript  
# 1.x代码结构  

app  

app.js  

context.js  

data  

docker.env  

Dockerfile  

...  

upgrade  

-- 1.x-to-2.x.sh  

-- doodoo (2.x代码存放目录)  

-- oneStepInstall.sh

升级步骤

1.打开链接https://gitee.com/doodooke/doodoo,下载2.0开源版;

2.执行命令yarn && npm run bootstrap,安装依赖;

3.执行命令npm run dev,启动开发者模式;

4.打开127.0.0.1:3000,登录插件市场,下载相应版本插件;

5.执行1.x-to-2.x.sh脚本,完成1.x版本升级2.x版本;

6.执行pm2 delete doodooke && pm2 start pm2.json,完成升级。

常见问题

1.x版本号默认是3000端口,安装插件之前,需要修改2.x端口号。

2..env配置项需要修改配置CMD_INSTALL && CMD_BUILD,修改内容如下

CMD_INSTALL=yarn install && npm run bootstrap

CMD_BUILD=npm run bootstrap && npm run web:build

3.nginx配置,新增default_server支持代理商

server {

servername ;

listen 80 default_server;

set $node_port 3000;

location / {

proxy_http_version 1.1;

proxy_set_header X-Real-IP $remote_addr;

proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;

proxy_set_header Host $http_host;

proxy_set_header X-NginX-Proxy true;

proxy_set_header Upgrade $http_upgrade;

proxy_set_header Connection "upgrade";

proxy_pass http://127.0.0.1:$node_port$request_uri;

proxy_redirect off;

}

}

脚本内容

1.x-to-2.x.sh


# 拷贝配置文件  

cp ./../.env ./doodoo  

cp ./../.env.web ./doodoo  

cp ./../docker.env ./doodoo  

cp ./../LICENSE.key ./doodoo  

# 拷贝favicon  

cp ./../web/static/favicon.ico ./doodoo/www  

# 拷贝logo  

cp -r ./../data/logo ./doodoo/www/logo  

# 拷贝web static  

cp -r ./../web/static/assets ./doodoo/www/assets  

# 拷贝web www  

cp -r ./../web/static/www ./doodoo/www/www

创建插件&模块

| 创建插件前需要执行命令npm i -g lerna全局安装lerna。doodooke默认使用lerna管理npm包,lerna的使用方式,参考https://github.com/lerna/lerna

创建模块

例子:创建a模块

执行命令lerna create a app

注意:a模块的package.json的name字段值应该是a

模块目录参考

模块 a 目录参考

a

-- controller(控制器存放文件夹)

-- model(数据库model存放文件夹)

-- node_modules

-- sql(sql存放文件夹)

-- static(可以在vue里面引用)

-- view(vue页面)

-- www(可以直接通过域名访问的资源)

-- hook.js(钩子)

-- package.json

-- README.md

-- yarn.lock

创建插件

例子:创建b插件

执行命令lerna create b plugin

注意:b插件的package.json的name字段的值应该是doodoo-plugin-b

b

-- lib

-- node_modules

-- package.json

-- README.md

-- yarn.lock

多多客(doodooke.com)更新日志20181130

1、小程序端显示商品销量;

2、营销订单增加按照支付状态、订单号、订单状态、下单时间等搜索;

3、主题颜色增加白色、橙色、黄色;

4、商品详情页图片全屏展示;

5、商品后台订单管理显示详细的物流信息;

6、增加家电维修、婴儿游泳馆、服装小程序模板;

7、点击事件增加分销、会员卡、优惠券;

8、文章支持跳转到列表和单篇两种方式;

9、文章转发显示文章标题而不是小程序名称;

10、注册登录页面和商家管理后台增加官网客服;

11、新增新零售下单限制下单距离;

12、超管功能重构;

13、cms文章seo标题优化;

14、新增支持自定义web页面,css。

继续阅读 »

温馨提示

本教程是1.x升级2.x手动升级指南。由于本次更新涉及到主框架更新,因此本次更新先提供手动升级指南。后续根据情况再进行推送升级。

| 2.x版本引入了npm包管理工具lerna,系统主要是有2个目录,一个是app目录,存放模块。另外一个是plugin目录,存放插件。

目录结构(重要)

javascript  
# 1.x代码结构  

app  

app.js  

context.js  

data  

docker.env  

Dockerfile  

...  

upgrade  

-- 1.x-to-2.x.sh  

-- doodoo (2.x代码存放目录)  

-- oneStepInstall.sh

升级步骤

1.打开链接https://gitee.com/doodooke/doodoo,下载2.0开源版;

2.执行命令yarn && npm run bootstrap,安装依赖;

3.执行命令npm run dev,启动开发者模式;

4.打开127.0.0.1:3000,登录插件市场,下载相应版本插件;

5.执行1.x-to-2.x.sh脚本,完成1.x版本升级2.x版本;

6.执行pm2 delete doodooke && pm2 start pm2.json,完成升级。

常见问题

1.x版本号默认是3000端口,安装插件之前,需要修改2.x端口号。

2..env配置项需要修改配置CMD_INSTALL && CMD_BUILD,修改内容如下

CMD_INSTALL=yarn install && npm run bootstrap

CMD_BUILD=npm run bootstrap && npm run web:build

3.nginx配置,新增default_server支持代理商

server {

servername ;

listen 80 default_server;

set $node_port 3000;

location / {

proxy_http_version 1.1;

proxy_set_header X-Real-IP $remote_addr;

proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;

proxy_set_header Host $http_host;

proxy_set_header X-NginX-Proxy true;

proxy_set_header Upgrade $http_upgrade;

proxy_set_header Connection "upgrade";

proxy_pass http://127.0.0.1:$node_port$request_uri;

proxy_redirect off;

}

}

脚本内容

1.x-to-2.x.sh


# 拷贝配置文件  

cp ./../.env ./doodoo  

cp ./../.env.web ./doodoo  

cp ./../docker.env ./doodoo  

cp ./../LICENSE.key ./doodoo  

# 拷贝favicon  

cp ./../web/static/favicon.ico ./doodoo/www  

# 拷贝logo  

cp -r ./../data/logo ./doodoo/www/logo  

# 拷贝web static  

cp -r ./../web/static/assets ./doodoo/www/assets  

# 拷贝web www  

cp -r ./../web/static/www ./doodoo/www/www

创建插件&模块

| 创建插件前需要执行命令npm i -g lerna全局安装lerna。doodooke默认使用lerna管理npm包,lerna的使用方式,参考https://github.com/lerna/lerna

创建模块

例子:创建a模块

执行命令lerna create a app

注意:a模块的package.json的name字段值应该是a

模块目录参考

模块 a 目录参考

a

-- controller(控制器存放文件夹)

-- model(数据库model存放文件夹)

-- node_modules

-- sql(sql存放文件夹)

-- static(可以在vue里面引用)

-- view(vue页面)

-- www(可以直接通过域名访问的资源)

-- hook.js(钩子)

-- package.json

-- README.md

-- yarn.lock

创建插件

例子:创建b插件

执行命令lerna create b plugin

注意:b插件的package.json的name字段的值应该是doodoo-plugin-b

b

-- lib

-- node_modules

-- package.json

-- README.md

-- yarn.lock

多多客(doodooke.com)更新日志20181130

1、小程序端显示商品销量;

2、营销订单增加按照支付状态、订单号、订单状态、下单时间等搜索;

3、主题颜色增加白色、橙色、黄色;

4、商品详情页图片全屏展示;

5、商品后台订单管理显示详细的物流信息;

6、增加家电维修、婴儿游泳馆、服装小程序模板;

7、点击事件增加分销、会员卡、优惠券;

8、文章支持跳转到列表和单篇两种方式;

9、文章转发显示文章标题而不是小程序名称;

10、注册登录页面和商家管理后台增加官网客服;

11、新增新零售下单限制下单距离;

12、超管功能重构;

13、cms文章seo标题优化;

14、新增支持自定义web页面,css。

收起阅读 »

HBuilder使用夜神模拟器调试Android应用

调试模式常见问题
  1. 由于方法在网站上都能搜到,则提供一个链接,以便与参考:
    原文:https://www.cnblogs.com/stulzq/p/5123875.html

  2. 注意事项
    通过以上方法可以使HBuilder与夜神模拟器建立链接,但是还不能直接使用;需要修改HBuilder中有关Android的端口才行;
    如图:
    1)点击工具--》选项,修改端口号

    2) 重启HBuilder软件

继续阅读 »
  1. 由于方法在网站上都能搜到,则提供一个链接,以便与参考:
    原文:https://www.cnblogs.com/stulzq/p/5123875.html

  2. 注意事项
    通过以上方法可以使HBuilder与夜神模拟器建立链接,但是还不能直接使用;需要修改HBuilder中有关Android的端口才行;
    如图:
    1)点击工具--》选项,修改端口号

    2) 重启HBuilder软件

收起阅读 »

寻找apk中的聊天窗口

  1. 在HBuilder中新建Hello mui示例:
  2. 找到文件夹example:
  3. 寻找文件im-chat.html:
继续阅读 »
  1. 在HBuilder中新建Hello mui示例:
  2. 找到文件夹example:
  3. 寻找文件im-chat.html:
收起阅读 »

中国传统风格企业网站风水堪舆企业网站html静态模板

html

分析一款中国传统风格企业网站风水堪舆企业网站html静态模板,需要的站长到八叔模板堂看看

分析一款中国传统风格企业网站风水堪舆企业网站html静态模板,需要的站长到八叔模板堂看看

如何为手机APP添加智能客服功能?

最近开发运营了一款APP产品,一个偶然的机会发现了一个帖子https://www.jianshu.com/p/ed8c707a2354,一个免费的智能客服工具,于是花了半天研究了一下,很快就把它集成到了APP里,分享给可能有需要的站友

最近开发运营了一款APP产品,一个偶然的机会发现了一个帖子https://www.jianshu.com/p/ed8c707a2354,一个免费的智能客服工具,于是花了半天研究了一下,很快就把它集成到了APP里,分享给可能有需要的站友

网络请求封装

1 npm install flyio -S
2 新建文件/util/request.js
import flyio from 'flyio'
//设置超时
flyio.config.timeout = 20000;
//设置请求基地址
flyio.config.baseURL = '***'

// 添加请求拦截器
flyio.interceptors.request.use((request) => {
// 在发送请求之前做些什么
let token = uni.getStorageSync('aliToken')
if (token) {
request.headers['token'] = token
}
return request
}, function (error) {
// 对请求错误做些什么
return Promise.reject(error)
})

flyio.interceptors.response.use((res) => {
// 对响应数据做些事
// if (!res.data) {
// return Promise.reject(res)
// }
return res
}, (error) => {
return Promise.reject(error)
})
const ajaxMethod = ['get', 'post']
const Api = {}
ajaxMethod.forEach((method) => {
Api[method] = function (uri, data, config) {
return new Promise(function (resolve, reject) {
flyio[method](uri, data, config).then((response) => {
if (response.data.StatusCode === 200) {
if (response.headers.token) {
console.log(response)
// console.log(response.headers.token)
uni.setStorageSync('aliToken', response.headers.token)
uni.setStorageSync('isFirstLogin', true)
}
resolve(response.data)
} else {
uni.showToast({
title: response.data.Message || 'fetch data error',
duration: 3000,
icon: 'none'
})
}
}).catch(function (error) {
if (error.response && error.response.status === 401) {
// 请求已发出,但服务器响应的状态码不在 2xx 范围内
let isFirstLogin = uni.getStorageSync('isFistLogin')
if (isFirstLogin) {
uni.showToast({
title: '登录信息失效',
duration: 3000,
icon: 'none'
})
}
uni.setStorageSync('updateUserInfo', '')
uni.removeStorageSync('aliToken')
// 进入首页
// console.log(error.response.data)
// console.log(error.response.status)
// console.log(error.response.headers)
} else {
console.log(error)
// Something happened in setting up the request that triggered an Error
// console.log('Error', error.message)
}
// console.log(error.config)
})
})
}
})

export default Api

3 挂载到vue实例 (main.js)
import Api from './util/request.js'
Vue.prototype.$flyio = Api

4 调用
this.$flyio.get(urls.userInfo).then((res) => {
console.log(res)
uni.showToast({
title: '获取信息成功',
icon: 'success'
})
})

5 说明
登录成功,返回信息包含token,之后的请求需要将token设置到request的headers中,每个请求请求成功后需要获取response中的token并更新token的值;后端需要放开option请求;

继续阅读 »

1 npm install flyio -S
2 新建文件/util/request.js
import flyio from 'flyio'
//设置超时
flyio.config.timeout = 20000;
//设置请求基地址
flyio.config.baseURL = '***'

// 添加请求拦截器
flyio.interceptors.request.use((request) => {
// 在发送请求之前做些什么
let token = uni.getStorageSync('aliToken')
if (token) {
request.headers['token'] = token
}
return request
}, function (error) {
// 对请求错误做些什么
return Promise.reject(error)
})

flyio.interceptors.response.use((res) => {
// 对响应数据做些事
// if (!res.data) {
// return Promise.reject(res)
// }
return res
}, (error) => {
return Promise.reject(error)
})
const ajaxMethod = ['get', 'post']
const Api = {}
ajaxMethod.forEach((method) => {
Api[method] = function (uri, data, config) {
return new Promise(function (resolve, reject) {
flyio[method](uri, data, config).then((response) => {
if (response.data.StatusCode === 200) {
if (response.headers.token) {
console.log(response)
// console.log(response.headers.token)
uni.setStorageSync('aliToken', response.headers.token)
uni.setStorageSync('isFirstLogin', true)
}
resolve(response.data)
} else {
uni.showToast({
title: response.data.Message || 'fetch data error',
duration: 3000,
icon: 'none'
})
}
}).catch(function (error) {
if (error.response && error.response.status === 401) {
// 请求已发出,但服务器响应的状态码不在 2xx 范围内
let isFirstLogin = uni.getStorageSync('isFistLogin')
if (isFirstLogin) {
uni.showToast({
title: '登录信息失效',
duration: 3000,
icon: 'none'
})
}
uni.setStorageSync('updateUserInfo', '')
uni.removeStorageSync('aliToken')
// 进入首页
// console.log(error.response.data)
// console.log(error.response.status)
// console.log(error.response.headers)
} else {
console.log(error)
// Something happened in setting up the request that triggered an Error
// console.log('Error', error.message)
}
// console.log(error.config)
})
})
}
})

export default Api

3 挂载到vue实例 (main.js)
import Api from './util/request.js'
Vue.prototype.$flyio = Api

4 调用
this.$flyio.get(urls.userInfo).then((res) => {
console.log(res)
uni.showToast({
title: '获取信息成功',
icon: 'success'
})
})

5 说明
登录成功,返回信息包含token,之后的请求需要将token设置到request的headers中,每个请求请求成功后需要获取response中的token并更新token的值;后端需要放开option请求;

收起阅读 »

<component :is="item" v-for="item in list"></component> 无法支持小程序和app官方没有说明 或者有什么代替方案么

<component :is="item" v-for="item in list"></component> 无法支持小程序和app官方没有说明 或者有什么代替方案么

<component :is="item" v-for="item in list"></component> 无法支持小程序和app官方没有说明 或者有什么代替方案么

流应用发展方向(建议)

流应用

建议把百度 京东 搜索,那些热门应用去掉,那些体验并不好,都是简版的,
搜索是流应用的入口,应该搜索 推荐 流应用产品
用流应用的开发者,都是不能上ios,才用的,流应用就是自己应用的外壳
开发者最希望,自己的应用唯一,没有其他竞品,没有广告
用户是不会主动下载 流应的,
都是开发者 强行让用户下载使用
中大应用,也不会用流应用,有小程序了
所以流应用的主要用户,就是小开发者的ios端用户

继续阅读 »

建议把百度 京东 搜索,那些热门应用去掉,那些体验并不好,都是简版的,
搜索是流应用的入口,应该搜索 推荐 流应用产品
用流应用的开发者,都是不能上ios,才用的,流应用就是自己应用的外壳
开发者最希望,自己的应用唯一,没有其他竞品,没有广告
用户是不会主动下载 流应的,
都是开发者 强行让用户下载使用
中大应用,也不会用流应用,有小程序了
所以流应用的主要用户,就是小开发者的ios端用户

收起阅读 »