小程序之按钮点击之后,显示和隐藏切换

wxml

<navigator bindtap=‘share‘ hover-class="none">
    <view class=‘‘>分享乐活
      <image class=‘fr‘ src=‘/img/arrorw.png‘></image>
    </view>
  </navigator>
  <view class=‘share‘  wx:if="{{shareshow}}">
    <view class=‘shareTo‘>
      <view class=‘line‘></view>
      <view class=‘to‘>分享到</view>
      <view class=‘line‘></view>
    </view>
    <button open-type="share" hover-class="none">
      <image src="/img/wechat.png" class=‘wechat‘></image>
      <view class=‘‘>微信好友</view>
    </button>
  </view>

wxjs

// pages/set/set.js
Page({
  data: {
    shareshow: false
  },

  onLoad: function(options) {

  },

  onShow: function() {

  },
  share:function(){
    var that = this;
    var shareshow = that.data.shareshow
    that.setData({
      shareshow: !that.data.shareshow
    })
  },
  onShareAppMessage: function (res) {
    if (res.from === ‘button‘) {
    }
    return {
      title: ‘分享‘,
      path: ‘/pages/index/index‘,
      success: function (res) {
        console.log(‘成功‘, res)
      }
    }
  }
})

原文地址:https://www.cnblogs.com/xiaoxiao2017/p/10795517.html

时间: 2024-09-29 01:08:26

小程序之按钮点击之后,显示和隐藏切换的相关文章

小程序悬浮按钮进入内页

wxml: <!-- 小程序悬浮按钮进入内页 --> <navigator class="set_button" url='../set/set' hover-class='none'> <image class="set_image" src="/images/set.png"></image> </navigator> wxss: .set_button{ background-co

第一个微信小程序(实现点击一个按钮弹出toast)

今天根据网上的教程搭建了微信小程序的环境,然后看文档做了一个简单的小应用. 项目的目录是这个样子的: app.js.app.json.app.wxss是全局文件,必不可少的文件.定义在app.wxss中的样式为全局样式,作用于每一个页面.在page的wxss文件中定义的样式为局部样式,只作用在对应的页面,并会覆盖app.wxss中相同的选择器. app.js文件代码: App({ onLaunch: function () { console.log('小程序已启动') }, onShow: f

微信小程序 在使用wx.request时显示加载中

微信小程序中,向后台请求数据是,通常想给用户提示正在加载中,如下图: 我们可以用wx.showLoading(OBJECT),当请求服务器的地方多了,怎么才能不每次都要去调用函数,我们只要对wx.request加工下就可以了,在utils下新建js文件network.js var requestHandler = { url: '', data: {}, method: '', success: function (res) { }, fail: function () { }, complet

微信小程序:获取地理定位和显示相应的城市名称。

最近在看微信小程序,遇到地理定位显示城市名称的问题.本文就是记录这一过程. 解决方案                                                                                                                                               小程序的wx.getLocation()获得是经纬度并不包含地名,所以要通过经纬度用相应的地图转换出地名(本文使用的是百度地图).

小程序通过接口请求获取图片显示问题

小程序文档例子,要放到函数当中 wx.request({ url: 'test.php', // 仅为示例,并非真实的接口地址 data: { x: '', y: '' }, header: { 'content-type': 'application/json' // 默认值 }, success(res) { console.log(res.data) } }) 获取到图片地址http://127.0.0.1/minishop/public/uploads/banner/20190429\4

小程序里input宽度与文字显示的问题

不知道是不是bug,微信小程序里input宽度缩小,input可输入文字的区域会缩小的更多,比如说你把input宽度设置为90%,则input文字输入可显示的区域可能只有80%左右. //(存在疑点=>)目前的解决方法:在input输入框外面套一层view,通过改变view的宽度控制input的长度,这样不会影响文字显示 注意 input框上 不能加display:flex 属性 原文地址:https://www.cnblogs.com/panghu123/p/12178187.html

小程序开发二三事--图片错误显示默认图

小程序的image组件不像普通html 的image,没有onerror属性,不过有个binderror回调方法.却不像onerror="this.src='/static/img/fmdefault.png'"来的方便. binderror 当错误发生时,发布到 AppService 的事件名,事件对象event.detail = {errMsg: 'something wrong'}; 当图片错误时,调用binderror方法,然后去改变image的src绑定的值. <ima

02微信小程序-轮播的宽度100%显示和轮播的基础配置

1==>如何让轮播的宽度100%显示? 你先给swiper 外面添加一个大盒子,给大盒子一个类 . <view class='lunbobox'> 然后wxss 里面设置 image , width: 100%; 在设置大盒子的宽度 width: 100%; 这样就可以了. <view class='lunbobox'> <!-- 轮播开始 --> <swiper indicator-dots="{{indicatorDots}}" ci

微信小程序,获取点击元素的索引值index

1.需求说明 点击 "加号图片" 上传图片,需要知道点击的是第几个图片,动态的修改src数组,这里图片用的 wx:for 循环出来的 2.遇到问题 按照官方最新文档循环的方式,索引值是以  wx:for-index="index" 方式写的,以   parseInt(event.currentTarget.dataset.index)  方式获取索引一直是NaN,注意这里用的是currentTarget,而不是target. 这里说一下他们的区别:target指向发