首页
题库
面试
求职
学习
竞赛
More+
所有博客
搜索面经/职位/试题/公司
搜索
我要招人
去企业版
登录 / 注册
首页
>
试题广场
>
请实现一个弹出对话框组件, 如下图(可以使用vue, jqu
[问答题]
请实现一个弹出对话框组件, 如下图(可以使用vue, jquery, react等框架)
添加笔记
求解答(15)
邀请回答
收藏(22)
分享
纠错
1个回答
添加回答
1
牛客689120132号
<
template
>
<
div
class
=
"cover"
v-show
=
"
show
"
>
<
div
class
=
"popup"
>
<
header
>
<
span
><
slot
name
=
"header"
>默认标题</
slot
></
span
>
<
span
@
click
=
"
hide
"
>×</
span
>
</
header
>
<
nav
>
<
slot
name
=
"content"
>默认内容</
slot
>
</
nav
>
<
footer
>
<
button
@
click
=
"
hide
"
>确认</
button
>
</
footer
>
</
div
>
</
div
>
</
template
>
<
script
>
export
default
{
data
(){
return
{
show
:
true
,
}
},
methods
:{
hide
(){
this
.
show
=
false
;
}
},
}
</
script
>
<
style
lang
=
"scss"
scoped
>
.cover
{
position:
fixed
;
top:
0
;
left:
0
;
width:
100
%
;
height:
100
%
;
background-color:
rgb
(
111
,
111
,
111
,
0.2
) ;
.popup
{
color:
black
;
width:
300
px
;
height:
300
px
;
position:
fixed
;
top:
50
%
;
left:
50
%
;
transform:
translate3d
(
-50
%
,
-50
%
,
10
px
);
background-color: antiquewhite;
z-index:
1000
;
header
{
background-color: aquamarine;
padding:
5
px
10
px
;
display:
flex
;
justify-content:
space-between
;
span
{
cursor
:
pointer
;
font-size:
larger
;
}
}
nav
{
height:
200
px
;
padding:
5
px
10
px
;
}
}
}
</
style
>
发表于 2020-06-28 11:12:25
回复(0)
这道题你会答吗?花几分钟告诉大家答案吧!
提交观点
问题信息
前端工程师
2019
蘑菇街
上传者:
小小
难度:
1条回答
22收藏
2712浏览
热门推荐
相关试题
(verbal)最近的研究显示,许...
言语理解与表达
2019
普华永道
人力资源
审计
税务服务
风险管理
管理咨询
行政管理
评论
(3)
来自
职能类模拟题14
(verbal)最近的研究显示,许...
言语理解与表达
2019
普华永道
人力资源
审计
税务服务
风险管理
管理咨询
行政管理
评论
(2)
来自
职能类模拟题14
5.下列判断正确的是( )
资料分析
言语理解与表达
资料分析
评论
(1)
《拳皇97》最后BOSS是谁?
游戏常识
评论
(1)
《魔兽世界》中,下列不属于玩家可以...
游戏常识
评论
(1)
扫描二维码,关注牛客网
意见反馈
下载牛客APP,随时随地刷题