Vue3学习（十三）之 Modal 对话框、表单的使用

写在前面

好久没学习更新博客了，不是懒，也不是不想学习，而是之前把大部分精力都去谈恋爱了,没法做到学习和恋爱都兼顾的很好。

可能有的同学会说，六哥，你都这么努力了，咋还是分了？换我，我就能处理的很好。

我想说，兄弟你是怎么做到地？来文末留言，或者私信我即可！

任务

• 点击每一行编辑按钮，弹出编辑框
• 编辑框显示电子书表单

表单的使用

秒变正经，进入正题，其实还是围绕Ant Design Vue中组件的使用展开，相信我，这并不难。

用大林哥的话说：

写代码不就是复制粘贴改嘛！

至少这一刻，我是认可这句话的。

如何实现？

两步走，第一要使用Modal 对话框，要弹出对话框，然后加入From表单即可。

点击编辑按钮弹出对话框

加入Modal 对话框，示例代码如下：

编译运行，查看效果如下：

编辑框显示表单

这步感觉就更简单了，只要在Modal 对话框中加入Form表单即可，其本质还是组件的嵌套，整合代码如下：

编译运行，结果如下图：

难点：

需要定义响应式变量，实现动态绑定传值，即点击编辑会带入当前选中列的属性值

写在最后

记得曾在头过年的前两天，看到这样一条朋友圈，让我重拾信心，又想继续学习了，如下图：

由于刚失恋不久，导致自己什么都不爱干，干什么都没有兴致。

看完他的朋友圈后，突然意识到自己不能这样总虚度时光的，应该和他学习，于是我就直接在他朋友圈下面写了这一段话：

不重要 有想变强的决心就可以了 至于什么变成大神 只是时间问题罢了

这句话同样送给那些惧怕代码的同学，其实大家都一样，你与大神差的只是想变强的决心罢了。

我觉得更多的时候，要学习下死神里的十一番队队长更木剑八，是一个特别享受战斗的人，他的信念就是只有战斗才能变强。

同理，代码也是一样总去写，不断地去写，才能进步，至于能不能成为大神，只是时间早晚的问题罢了。

如果屏幕前的你，还是觉得写代码很难，那么此刻，你也没什么可惧怕的，尽情享受就好了，如果还有什么担心，可以文末留言给我，也许我的经历会让你喜欢coding，也说不定呢。