脑残跳坑指南v16.10.10

此处记录一些项目中跳进的坑，或深或浅。大概算是工作的错题集吧。现阶段跳进的，大多都是脑残才会跳进的坑。祈祷我早日跳完脑残坑吧。

关于css

• 上传头像部分未设置图片的大小，导致上传的头像过大，搞笑！
• 使用bootstrap的圆形图片类名img-circle，类似于给图片设置border-radius: 50%，图片需为正方形，否则设置后，图片就转为了椭圆形而非圆形。

关于vue.js

• 使用v-model支持双向绑定
• html中使用的变量，如在v-model=" "、v-show=" "中使用的变量，皆应在<script> </script>的data中进行声明。如下：

data: function() {
       return {
                变量名1: '',
                变量名2: '',
                变量名3: ''
                ......
            }
        },

javascript是属于弱类型语言，故不需考虑变量的实际格式，声明变量时皆可用string类型。

• html中调用的方法，应在<script> </script>的method中创建。页面加载时需调用的方法，应在ready中声明。同时，ready中的方法名以及method中的方法所调用的参数，应在其前加this.，如下：

        ready: function() {
           this.方法名1();
           this.方法名2();
            ......
        },

• 此外也学到了通过v-show设置不同的变量值，同时为按钮添加切换变量值的方法，实现点击不同的按钮跳出不同内容的弹出框的功能。

clock.gif