小程序如何去掉button组件的边框

小程序获取用户授权不再支持wx.getUserInfo方法,改为用button获取,格式如下

<button class="btn btn" open-type="getUserInfo" @getuserinfo="getUserInfo">授权</button>

小程序授权更改说明文档

问题是我不想用button,我想用个图片是否可以呢?一开始我直接用<image src=‘xxx‘ open-type="getUserInfo" @getuserinfo="getUserInfo"/>,结果无效,应使用下面的方法

 <button class="btn"  open-type="getUserInfo" @getuserinfo="getUserInfo">
     <image src="../images/login.png"/>
</button>

如了,这下变成按钮图片了,但是图片周围的边框是什么鬼

去掉边框还不简单吗,写个border:none的样式不就好了,你可以试试有效果没有

.btn{
   border:none
}

最终发现button的边框是通过伪元素生成的,写成下列代码才行

button::after{

border:none;

}

原文地址:https://www.cnblogs.com/94pm/p/9065629.html

时间: 2024-08-01 17:13:43

小程序如何去掉button组件的边框的相关文章

微信小程序开发-地图map组件上使用input组件

微信小程序开发-地图map组件上使用input组件 标签: 微信小程序 uni-app 原生组件层级关系 微信小程序在最高层级 在微信小程序中原生组件包括camera canvas input(仅在focus时表现为原生组件) live-player live-pusher map textarea video 在微信小程序开发中原生组件的层级是最高的,所以页面中的其他组件无论设置 z-index 为多少,都无法盖在原生组件上. 后插入的原生组件可以覆盖之前的原生组件. 原生组件还无法在 pic

微信小程序(3)——常用的组件

view: view是小程序中的视图容器之一,似于html中的<div>标签 <view class="section"> <view class="section__title">flex-direction: row</view> <view class="flex-wrp" style="flex-direction:row;"> <view class=

微信小程序开发—快速掌握组件及API的方法---转载

微信小程序框架为开发者提供了一系列的组件和API接口. 组件主要完成小程序的视图部分,例如文字.图片显示.API主要完成逻辑功能,例如网络请求.数据存储.音视频播放控制,以及微信开放的微信登录.微信支付等功能. 组件 官方文档:https://mp.weixin.qq.com/debug/wxadoc/dev/component/ 对于开发文档,个人建议先了解其整体框架,了解其提供了哪些组件,再联想到这些组件会用在哪些产品的哪些功能.对于接口也是一样,整体了解,而不需要细看. 熟悉了文档的结构,

小程序---电影商城--娱乐组件

一.小程序---电影商城--娱乐组件 功能一:创建home添加元素并且修改外观 功能二:当组件创建成功后发送请求(调用云函数) movielist1906 onload 功能三:当前组件三种操作 (1)当前组件创建成功显示第一页 start:0.count:4 -onLoad -调用云函数movielist1906 -将云函数返回结果显示模块 (2)用户上滑屏幕加载下一页 57 -onReachBottom   事件:向上滑动触底 (3)当用户点击"详情"按钮跳转下一个组件 comme

手摸手教你微信小程序开发之自定义组件

前言 相信大家在开发小程序时会遇到某个功能多次使用的情况,比如弹出框.这个时候大家首先想到的是组件化开发,就是把弹出框封装成一个组件,然后哪里使用哪里就调用,对,看来大家都是有思路的人,但是要怎样实现呢.可能你会去看官方文档,但是微信的官方文档也是说的不太清楚,所以写起来也是非常痛苦.今天就带大家手摸手开发微信组件,坐稳了,马路杀手要开车了. 具体实现 我们先实现个简单的弹窗组件,详情图如下: 1.新建component文件夹存放我们的组件,里边存放的就是我们所用的组件,我们今天要做的事弹出框,

一款优雅的小程序拖拽排序组件实现

前言 最近po主写小程序过程中遇到一个拖拽排序需求. 上网一顿搜索未果, 遂自行实现. 这次就不上效果图了, 直接扫码感受吧. 灵感 首先由于并没有啥现成的小程序案例给我参考. 所以有点无从下手, 那就找个h5的拖拽实现参考参考. 于是在jquery插件网看了几个拖拽排序实现后基本确定了思路. 大概就是用 transform 做变换. 是的, 灵感这种东西就是借鉴过来的-- 确定需求 要能拖拽, 毕竟是拖拽排序嘛, 拖拽肯定是第一位. 要能排序, 先有拖拽后有天 -- 跑偏了, 拖拽完了肯定是要

微信小程序开发05-日历组件的实现

接上文:微信小程序开发04-打造自己的UI库 github地址:https://github.com/yexiaochai/wxdemo 我们这里继续实现我们的日历组件,这个日历组件稍微有点特殊,算是相对复杂的组件了,然后一般的日历组件又会有很多的变化,所以我们这里实现最基本的标签即可: 1 let View = require('behavior-view'); 2 const util = require('../utils/util.js'); 3 4 // const dateUtil

小程序如何封装自定义组件(Toast)

1.创建和pages 同级的component目录新建一个myToast目录 例如: 2.myToast.wxml文件内容: <!-- 自定义toast组件 --> <!-- name 模块名称 --> <template name="toast" > <!-- catchtouchmove='xxx' 遮罩层的滚动穿透 --> <!-- isHide 显示消失 --> <view class="toast_c

微信小程序怎样快速新建组件文件

在app.json中,page选项中设置即可, "pages": [ //放在第一行的配置,启动小程序时,会默认显示 "pages/haha/haha", // 这样配置,会在目录中生成一个haha的文件夹,并生成了对应的组件文件 "pages/testPage/testPage" ], 生成目录如下: 原文地址:https://www.cnblogs.com/luguankun/p/10887941.html