vue2+elementUI重构特性阻抗计算网站

我前面因为毕业设计写过一个计算微波射频方面特性阻抗的网页，但是那时候还没学vue，加上当时得知jQuery被废弃了，就只用了原生js写的，代码很冗杂。虽然确实也分了模块，但是还是觉得不够优雅，再加上没找到好看的logo，自己去ppt里面用艺术字做了一个，白色太亮了，仅次一级的颜色我选了个蓝色，然后截图，为了不让它被看出来，body 的颜色也选了蓝色，总之就是比较丑陋，不知道为什么当时竟然觉得很特别。下面放张原图看一下。

后面接触了vue，我就想一定要找时间把它重构了。后面学完了vue，还了解了一些组件库，所以决定用vue+elementUI拯救代码的不优雅和页面的丑陋。最近刚好刚做完一个nodejs的案例，准备做一个vue的项目案例。但是毕业设计和毕业论文又需要在5.4交个初稿，所以趁现在吧，也为后面的vue项目积累经验。

---

今天重构了一部分，因为刚开始使用elementUI时候还是有点问题：

1. 最开始的问题是我先在elementUI上找了一个Container布局，但是我希望把他拆分成组件。但是拆分会报错（不知道是不是一开始就有错误，因为是拆分了才开始显示不正常，所以我看了控制台，它提示的错误信息是：

   Unknown custom element: - did you register the component correctly?

   后面我发现了错误，是引入顺序的问题：use这个组件库要在new Vue实例之前，就好了。

   Vue.config.productionTip = false
   Vue.use(ElementUI);
   new Vue({
     router,
     render: h => h(App)
   }).$mount('#app')
   

2. 第二个问题就是引入之后，我把它拆分了，但是拆分之后显示出了问题，修改样式也是没有用的，后来我一想，干嘛非要把东西都拆走，可以把它的标签留下，内容直接用组件填充就好了（当然也可以用插槽，但是这种静态的也不是刚需，所以我选了简单的写法）

3. 接下来就是路由的问题，再提醒自己一遍，路由使用规则：引入组件——>配置规则（path,component)——>路由的显示模块包裹

---

接下来就没什么问题啦，我这前面写过，剩下的也就是引入模块，然后给input和输入内容用v-model绑定，然后给提交按钮绑定点击事件，返回数据。最后效果就这样的，明天会把它做完，因为都是一样的逻辑，今天走通了一个子路由，明天就好弄了，看下效果。（我还是觉得有点点不好看，但是又不知道怎么改，不知道有没有人能给点建议）