Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
anyefeiyu
uni-app
提交
7a9f817f
U
uni-app
项目概览
anyefeiyu
/
uni-app
与 Fork 源项目一致
Fork自
DCloud / uni-app
通知
1
Star
1
Fork
0
代码
文件
提交
分支
Tags
贡献者
分支图
Diff
Issue
1
列表
看板
标记
里程碑
合并请求
0
DevOps
流水线
流水线任务
计划
Wiki
0
Wiki
分析
仓库
DevOps
项目成员
Pages
U
uni-app
项目概览
项目概览
详情
发布
仓库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
Issue
1
Issue
1
列表
看板
标记
里程碑
合并请求
0
合并请求
0
Pages
DevOps
DevOps
流水线
流水线任务
计划
分析
分析
仓库分析
DevOps
Wiki
0
Wiki
成员
成员
收起侧边栏
关闭侧边栏
动态
分支图
创建新Issue
流水线任务
提交
Issue看板
体验新版 GitCode,发现更多精彩内容 >>
提交
7a9f817f
编写于
9月 12, 2018
作者:
郭
郭胜强
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
为input增加清除和显示密码按钮
上级
61919a53
变更
7
隐藏空白更改
内联
并排
Showing
7 changed file
with
553 addition
and
17 deletion
+553
-17
examples/login-template/App.vue
examples/login-template/App.vue
+0
-9
examples/login-template/components/uni-icon/uni-icon.css
examples/login-template/components/uni-icon/uni-icon.css
+377
-0
examples/login-template/components/uni-icon/uni-icon.vue
examples/login-template/components/uni-icon/uni-icon.vue
+36
-0
examples/login-template/components/uni-input.vue
examples/login-template/components/uni-input.vue
+120
-0
examples/login-template/pages/login/login.vue
examples/login-template/pages/login/login.vue
+8
-4
examples/login-template/pages/pwd/pwd.vue
examples/login-template/pages/pwd/pwd.vue
+5
-1
examples/login-template/pages/reg/reg.vue
examples/login-template/pages/reg/reg.vue
+7
-3
未找到文件。
examples/login-template/App.vue
浏览文件 @
7a9f817f
...
...
@@ -74,15 +74,6 @@
line-height
:
50px
;
}
.input-row
input
{
width
:
80%
;
height
:
50px
;
min-height
:
50px
;
padding
:
15px
0
;
padding-right
:
30px
;
line-height
:
50px
;
}
.input-row.border
::after
{
position
:
absolute
;
right
:
0
;
...
...
examples/login-template/components/uni-icon/uni-icon.css
0 → 100644
浏览文件 @
7a9f817f
@font-face
{
font-family
:
uniicons
;
font-weight
:
normal
;
font-style
:
normal
;
src
:
url('https://img-cdn-qiniu.dcloud.net.cn/fonts/uni.ttf?t=1536565627510')
format
(
'truetype'
);
}
.uni-icon
{
font-family
:
uniicons
;
font-size
:
48
upx
;
font-weight
:
normal
;
font-style
:
normal
;
line-height
:
1
;
display
:
inline-block
;
text-decoration
:
none
;
-webkit-font-smoothing
:
antialiased
;
}
.uni-icon.uni-active
{
color
:
#007aff
;
}
.uni-icon-contact
:before
{
content
:
'\e100'
;
}
.uni-icon-person
:before
{
content
:
'\e101'
;
}
.uni-icon-personadd
:before
{
content
:
'\e102'
;
}
.uni-icon-contact-filled
:before
{
content
:
'\e130'
;
}
.uni-icon-person-filled
:before
{
content
:
'\e131'
;
}
.uni-icon-personadd-filled
:before
{
content
:
'\e132'
;
}
.uni-icon-phone
:before
{
content
:
'\e200'
;
}
.uni-icon-email
:before
{
content
:
'\e201'
;
}
.uni-icon-chatbubble
:before
{
content
:
'\e202'
;
}
.uni-icon-chatboxes
:before
{
content
:
'\e203'
;
}
.uni-icon-phone-filled
:before
{
content
:
'\e230'
;
}
.uni-icon-email-filled
:before
{
content
:
'\e231'
;
}
.uni-icon-chatbubble-filled
:before
{
content
:
'\e232'
;
}
.uni-icon-chatboxes-filled
:before
{
content
:
'\e233'
;
}
.uni-icon-weibo
:before
{
content
:
'\e260'
;
}
.uni-icon-weixin
:before
{
content
:
'\e261'
;
}
.uni-icon-pengyouquan
:before
{
content
:
'\e262'
;
}
.uni-icon-chat
:before
{
content
:
'\e263'
;
}
.uni-icon-qq
:before
{
content
:
'\e264'
;
}
.uni-icon-videocam
:before
{
content
:
'\e300'
;
}
.uni-icon-camera
:before
{
content
:
'\e301'
;
}
.uni-icon-mic
:before
{
content
:
'\e302'
;
}
.uni-icon-location
:before
{
content
:
'\e303'
;
}
.uni-icon-mic-filled
:before
,
.uni-icon-speech
:before
{
content
:
'\e332'
;
}
.uni-icon-location-filled
:before
{
content
:
'\e333'
;
}
.uni-icon-micoff
:before
{
content
:
'\e360'
;
}
.uni-icon-image
:before
{
content
:
'\e363'
;
}
.uni-icon-map
:before
{
content
:
'\e364'
;
}
.uni-icon-compose
:before
{
content
:
'\e400'
;
}
.uni-icon-trash
:before
{
content
:
'\e401'
;
}
.uni-icon-upload
:before
{
content
:
'\e402'
;
}
.uni-icon-download
:before
{
content
:
'\e403'
;
}
.uni-icon-close
:before
{
content
:
'\e404'
;
}
.uni-icon-redo
:before
{
content
:
'\e405'
;
}
.uni-icon-undo
:before
{
content
:
'\e406'
;
}
.uni-icon-refresh
:before
{
content
:
'\e407'
;
}
.uni-icon-star
:before
{
content
:
'\e408'
;
}
.uni-icon-plus
:before
{
content
:
'\e409'
;
}
.uni-icon-minus
:before
{
content
:
'\e410'
;
}
.uni-icon-circle
:before
,
.uni-icon-checkbox
:before
{
content
:
'\e411'
;
}
.uni-icon-close-filled
:before
,
.uni-icon-clear
:before
{
content
:
'\e434'
;
}
.uni-icon-refresh-filled
:before
{
content
:
'\e437'
;
}
.uni-icon-star-filled
:before
{
content
:
'\e438'
;
}
.uni-icon-plus-filled
:before
{
content
:
'\e439'
;
}
.uni-icon-minus-filled
:before
{
content
:
'\e440'
;
}
.uni-icon-circle-filled
:before
{
content
:
'\e441'
;
}
.uni-icon-checkbox-filled
:before
{
content
:
'\e442'
;
}
.uni-icon-closeempty
:before
{
content
:
'\e460'
;
}
.uni-icon-refreshempty
:before
{
content
:
'\e461'
;
}
.uni-icon-reload
:before
{
content
:
'\e462'
;
}
.uni-icon-starhalf
:before
{
content
:
'\e463'
;
}
.uni-icon-spinner
:before
{
content
:
'\e464'
;
}
.uni-icon-spinner-cycle
:before
{
content
:
'\e465'
;
}
.uni-icon-search
:before
{
content
:
'\e466'
;
}
.uni-icon-plusempty
:before
{
content
:
'\e468'
;
}
.uni-icon-forward
:before
{
content
:
'\e470'
;
}
.uni-icon-back
:before
,
.uni-icon-left-nav
:before
{
content
:
'\e471'
;
}
.uni-icon-checkmarkempty
:before
{
content
:
'\e472'
;
}
.uni-icon-home
:before
{
content
:
'\e500'
;
}
.uni-icon-navigate
:before
{
content
:
'\e501'
;
}
.uni-icon-gear
:before
{
content
:
'\e502'
;
}
.uni-icon-paperplane
:before
{
content
:
'\e503'
;
}
.uni-icon-info
:before
{
content
:
'\e504'
;
}
.uni-icon-help
:before
{
content
:
'\e505'
;
}
.uni-icon-locked
:before
{
content
:
'\e506'
;
}
.uni-icon-more
:before
{
content
:
'\e507'
;
}
.uni-icon-flag
:before
{
content
:
'\e508'
;
}
.uni-icon-home-filled
:before
{
content
:
'\e530'
;
}
.uni-icon-gear-filled
:before
{
content
:
'\e532'
;
}
.uni-icon-info-filled
:before
{
content
:
'\e534'
;
}
.uni-icon-help-filled
:before
{
content
:
'\e535'
;
}
.uni-icon-more-filled
:before
{
content
:
'\e537'
;
}
.uni-icon-settings
:before
{
content
:
'\e560'
;
}
.uni-icon-list
:before
{
content
:
'\e562'
;
}
.uni-icon-bars
:before
{
content
:
'\e563'
;
}
.uni-icon-loop
:before
{
content
:
'\e565'
;
}
.uni-icon-paperclip
:before
{
content
:
'\e567'
;
}
.uni-icon-eye
:before
{
content
:
'\e568'
;
}
.uni-icon-arrowup
:before
{
content
:
'\e580'
;
}
.uni-icon-arrowdown
:before
{
content
:
'\e581'
;
}
.uni-icon-arrowleft
:before
{
content
:
'\e582'
;
}
.uni-icon-arrowright
:before
{
content
:
'\e583'
;
}
.uni-icon-arrowthinup
:before
{
content
:
'\e584'
;
}
.uni-icon-arrowthindown
:before
{
content
:
'\e585'
;
}
.uni-icon-arrowthinleft
:before
{
content
:
'\e586'
;
}
.uni-icon-arrowthinright
:before
{
content
:
'\e587'
;
}
.uni-icon-pulldown
:before
{
content
:
'\e588'
;
}
.uni-icon-scan
:before
{
content
:
"\e612"
;
}
examples/login-template/components/uni-icon/uni-icon.vue
0 → 100644
浏览文件 @
7a9f817f
<
template
>
<view
class=
"uni-icon"
:class=
"['uni-icon-'+type]"
:style=
"
{color:color,'font-size':fontSize}" @click="onClick()">
</view>
</
template
>
<
script
>
export
default
{
props
:
{
/**
* 图标类型
*/
type
:
String
,
/**
* 图标颜色
*/
color
:
String
,
/**
* 图标大小
*/
size
:
Number
},
computed
:
{
fontSize
()
{
return
`
${
this
.
size
}
px`
}
},
methods
:
{
onClick
()
{
this
.
$emit
(
'
click
'
)
}
}
}
</
script
>
<
style
>
@import
"./uni-icon.css"
;
</
style
>
examples/login-template/components/uni-input.vue
0 → 100644
浏览文件 @
7a9f817f
<
template
>
<view
class=
"uni-input-view"
>
<input
:focus=
"focus_"
:type=
"inputType"
:value=
"value"
@
input=
"onInput"
class=
"uni-input-input"
:placeholder=
"placeholder"
:password=
"type==='password'&&!showPassword"
@
focus=
"onFocus"
@
blur=
"onBlur"
/>
<!-- 优先显示密码可见按钮 -->
<uni-icon
v-if=
"clearable_&&!displayable_&&value.length"
color=
"#666666"
type=
"clear"
size=
"20"
@
click=
"clear"
></uni-icon>
<uni-icon
v-if=
"displayable_"
:color=
"showPassword?'#666666':'#cccccc'"
type=
"eye"
size=
"20"
@
click=
"display"
></uni-icon>
</view>
</
template
>
<
script
>
import
uniIcon
from
'
./uni-icon/uni-icon.vue
'
export
default
{
components
:
{
uniIcon
},
props
:
{
/**
* 输入类型
*/
type
:
String
,
/**
* 值
*/
value
:
String
,
/**
* 占位符
*/
placeholder
:
String
,
/**
* 是否显示清除按钮
*/
clearable
:
{
type
:
[
Boolean
,
String
],
default
:
false
},
/**
* 是否显示密码可见按钮
*/
displayable
:
{
type
:
[
Boolean
,
String
],
default
:
false
},
/**
* 自动获取焦点
*/
focus
:
{
type
:
[
Boolean
,
String
],
default
:
false
}
},
model
:
{
prop
:
'
value
'
,
event
:
'
input
'
},
data
()
{
return
{
/**
* 显示密码明文
*/
showPassword
:
false
,
/**
* 是否获取焦点
*/
isFocus
:
false
}
},
computed
:
{
inputType
()
{
const
type
=
this
.
type
return
type
===
'
password
'
?
'
text
'
:
type
},
clearable_
()
{
return
String
(
this
.
clearable
)
!==
'
false
'
},
displayable_
()
{
return
String
(
this
.
displayable
)
!==
'
false
'
},
focus_
()
{
return
String
(
this
.
focus
)
!==
'
false
'
}
},
methods
:
{
clear
()
{
this
.
value
=
''
},
display
()
{
this
.
showPassword
=
!
this
.
showPassword
},
onFocus
()
{
this
.
isFocus
=
true
},
onBlur
()
{
this
.
$nextTick
(()
=>
{
this
.
isFocus
=
false
})
},
onInput
(
e
)
{
this
.
$emit
(
'
input
'
,
e
.
target
.
value
)
}
}
}
</
script
>
<
style
>
.uni-input-view
{
display
:
flex
;
flex-direction
:
row
;
align-items
:
center
;
width
:
100%
;
flex
:
1
;
padding
:
0
10
rpx
;
}
.uni-input-input
{
flex
:
1
;
width
:
100%
;
}
</
style
>
examples/login-template/pages/login/login.vue
浏览文件 @
7a9f817f
...
...
@@ -3,11 +3,11 @@
<view
class=
"input-group"
>
<view
class=
"input-row border"
>
<text
class=
"title"
>
账号:
</text>
<
input
type=
"text"
focus
v-model=
"account"
placeholder=
"请输入账号"
>
<
uni-input
class=
"uni-input"
type=
"text"
clearable
focus
v-model=
"account"
placeholder=
"请输入账号"
></uni-input
>
</view>
<view
class=
"input-row"
>
<text
class=
"title"
>
密码:
</text>
<
input
type=
"text"
password=
"true"
v-model=
"password"
placeholder=
"请输入密码"
>
<
uni-input
type=
"password"
displayable
v-model=
"password"
placeholder=
"请输入密码"
></uni-input
>
</view>
</view>
<view
class=
"btn-row"
>
...
...
@@ -32,8 +32,12 @@
mapState
,
mapMutations
}
from
'
vuex
'
import
uniInput
from
'
../../components/uni-input.vue
'
export
default
{
components
:
{
uniInput
},
data
()
{
return
{
providerList
:
[],
...
...
@@ -138,8 +142,8 @@
toMain
(
userName
)
{
this
.
login
(
userName
);
/**
* 强制登录时使用reLaunch方式跳转过来
* 返回首页也使用reLaunch方式
* 强制登录时使用reLaunch方式跳转过来
* 返回首页也使用reLaunch方式
*/
if
(
this
.
forcedLogin
)
{
uni
.
reLaunch
({
...
...
examples/login-template/pages/pwd/pwd.vue
浏览文件 @
7a9f817f
...
...
@@ -3,7 +3,7 @@
<view
class=
"input-group"
>
<view
class=
"input-row"
>
<text
class=
"title"
>
邮箱:
</text>
<
input
type=
"text"
focus
v-model=
"email"
placeholder=
"请输入邮箱"
>
<
uni-input
type=
"text"
focus
clearable
v-model=
"email"
placeholder=
"请输入邮箱"
></uni-input
>
</view>
</view>
...
...
@@ -15,8 +15,12 @@
<
script
>
import
service
from
'
../../service.js
'
;
import
uniInput
from
'
../../components/uni-input.vue
'
;
export
default
{
components
:
{
uniInput
},
data
()
{
return
{
email
:
''
...
...
examples/login-template/pages/reg/reg.vue
浏览文件 @
7a9f817f
...
...
@@ -3,15 +3,15 @@
<view
class=
"input-group"
>
<view
class=
"input-row border"
>
<text
class=
"title"
>
账号:
</text>
<
input
type=
"text"
focus
v-model=
"account"
placeholder=
"请输入账号"
>
<
uni-input
type=
"text"
focus
clearable
v-model=
"account"
placeholder=
"请输入账号"
></uni-input
>
</view>
<view
class=
"input-row border"
>
<text
class=
"title"
>
密码:
</text>
<
input
type=
"text"
password=
"true"
v-model=
"password"
placeholder=
"请输入密码"
>
<
uni-input
type=
"password"
displayable
v-model=
"password"
placeholder=
"请输入密码"
></uni-input
>
</view>
<view
class=
"input-row"
>
<text
class=
"title"
>
邮箱:
</text>
<
input
type=
"text"
v-model=
"email"
placeholder=
"请输入邮箱"
>
<
uni-input
type=
"text"
clearable
v-model=
"email"
placeholder=
"请输入邮箱"
></uni-input
>
</view>
</view>
<view
class=
"btn-row"
>
...
...
@@ -22,8 +22,12 @@
<
script
>
import
service
from
'
../../service.js
'
;
import
uniInput
from
'
../../components/uni-input.vue
'
;
export
default
{
components
:
{
uniInput
},
data
()
{
return
{
account
:
''
,
...
...
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录