用户
 找回密码
 立即注册

QQ登录

只需一步,快速开始

扫一扫,登录网站

1

主题

15

帖子

345

积分

特邀嘉宾

积分
345
2017-1-9 19:20:14 关我屁事 特邀嘉宾 楼主 37740
本帖最后由 关我屁事 于 2017-1-9 21:21 编辑

整个项目是基于weui做的,赶时间,先发一个粗糙的。没时间优化,先就这样,见谅
QQ图片20170109202923.jpg

这个只是做的情形之一,点击修改昵称,然后弹框。

[HTML] 纯文本查看 复制代码
        <view class="weui-cell weui-cell_access" hover-class="weui-cell_active" hover="{{true}}" bindtap="modal" data-modal="name">
                <view class="weui-cell__bd">昵称</view>
                <view class="weui-cell__ft weui-cell__ft_in-access">
                        {{user.nickName}}
                        <text wx:if="{{user.nickName==null}}">未填写</text>
                </view>
        </view>


[JavaScript] 纯文本查看 复制代码
        modal: function (e) {
                var self = this;
                this.setData({ modal: (e && e.currentTarget.dataset.modal) || "", input: self.data.user });
                // 这里对modal的赋值是关键
        }


[CSS] 纯文本查看 复制代码
.modals {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: rgba(0,0,0,.6);
  z-index: 1000;
}
.modal {
  position: fixed;
  top: 25px;
  right: 15px;
  bottom: 25px;
  left: 15px;
  background-color: #ffffff;
  z-index: 1000;
  border-radius: 6px;
}
.modal__close {
  text-align: right;
  position: relative;
  top: 10px;
  right: 10px;
}
.modal__hd {
  padding: 0 10px;
  text-align: center;
}
.modal__hd,.modal__ft {
  font-weight: 400;
  font-size: 17px;
}
.modal__ft {
  border-top: 1px solid #D9D9D9;
  display: flex;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
}
.modal__btn {
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  flex: 1;
  text-align: center;
  padding: 8px 0;
  border-left: 1rpx solid #D9D9D9;
}
.modal__btn:first-child {
  border: none;
}



评分

参与人数 1原创 +1 浮云 +20 收起 理由
天下雪 + 1 + 20 赞一个!

查看全部评分

选设计素材分类,竟然是一种什么样的心理
天下雪 发表于 2017-1-9 19:26
选设计素材分类,竟然是一种什么样的心理

那我选啥。。

具体的样子,截图放一张啊     
发新帖
    您需要登录后才可以回帖 登录 | 立即注册