前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >uniapp连接手机调试

uniapp连接手机调试

原创
作者头像
王小婷
修改2020-11-27 10:19:03
3.2K1
修改2020-11-27 10:19:03
举报
文章被收录于专栏:编程微刊
1:新建一个uniapp项目,命名为test。

可以看到,在开发工具HBuilderX里面,极速生成的模板目录结构如下

打开pages底下的index.vue的组件,开始写代码了,把代码写好,这里随便写了一个例子。

代码语言:javascript
复制
<template>
    <view>
        <button type="primary" @click="scanCode()">button</button>
    </view>
</template>

<script>
    export default {
        data() {
            return {

            };
        },
        methods: {
            scanCode() {
                let that = this;
                // 允许从相机和相册扫码
                uni.scanCode({
                    success: function(res) {
                        that.result1 = res.result;
                    }
                });


            }
        }
    }
</script>
2:允许USB调试

需要将手机用充电线连接电脑,并且允许USB调试(这一步很重要,不然HBuilderX搜不到你要调试的手机,无法建立连接。)

如果不会打开USB调试模式,可以自行百度,我的是oppor的手机 我就查了一下,oppor手机怎么打开USB调试模式. https://jingyan.baidu.com/article/93f9803fed1cfbe0e56f554d.html

3:真机调试

打开顶部菜单栏中的“运行”菜单,点击运行,选择运行到手机后者模拟器。

这个时候HBuilderX是自动检测手机是否连接,(如果运行设备为灰色,则说明没有手机没有连接成功)。

连接不成功的原因有很多,比如,手机没有打开usb调试模式,电脑中其他软件占用adb通道等。

连接成功,控制台里面会有这样的提示

并且在手机端提示安装HBuilderX,同意安装就行了。

4:调试结果

每次调试的时候,只需要打开HBuilderX,就能同步看到开发工具里面编辑的内容了。

原创声明:本文系作者授权腾讯云开发者社区发表,未经许可,不得转载。

如有侵权,请联系 cloudcommunity@tencent.com 删除。

原创声明:本文系作者授权腾讯云开发者社区发表,未经许可,不得转载。

如有侵权,请联系 cloudcommunity@tencent.com 删除。

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 1:新建一个uniapp项目,命名为test。
  • 2:允许USB调试
  • 3:真机调试
  • 4:调试结果
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档