博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
在 element ui 自定义的道路上越走越远
阅读量:4143 次
发布时间:2019-05-25

本文共 1707 字,大约阅读时间需要 5 分钟。

 从上往下 分别都是 

1 提示箭头放在下面, 并且颜色变成自定义颜色

2 step 进度条 先是把is process改成is wait  然后index+1

然后 更改进度条颜色 和样式

3 element ui 在表单校验的时候

成功后为绿色 其他为蓝色 所以都改成蓝色了

竟然要:hover  难怪用火狐找半天找不到在哪!

最后那个rgb  就是饿了么 总体ui  的color~

select 也真的好坑啊

icon 只要<i> 就可以
发现自从有了火狐的  查看元素 我如有神助  直接查看元素强制改类名就可以了  我爱火狐

1  select

 <div class="chooseDiv">

              <el-select v-model="provinceValue" placeholder="请选择省">
                <el-option
                  v-for="item in provinceData"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                ></el-option>
              </el-select>
              <el-select v-model="cityValue" placeholder="请选择市">
                <el-option
                  v-for="item in cityData"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                ></el-option>
              </el-select>
            </div>

下面要加这个 
   /*
      provinceValue: "",
      cityValue: "",
      areaValue: "",
      provinceData: [
        {
          provinceValue: "选项4",
          label: "444"
        },
        {
          provinceValue: "选项5",
          label: "555"
        }
      ],
      cityData: [
        {
          cityValue: "选项4444",
          label: "44444444"
        },
        {
          cityValue: "选项54444",
          label: "55544444"
        }
      ],
      areaData: [
        {
          areaValue: "选项11111111111",
          label: "111111111111111111111"
        }
      ],
      */

2 主动获取子组件的零食

  this.childDate = this.$refs.typeDate.infoForm;

绑定的时候  <component :is="switchAttest" ref="typeDate" class="statusattest-conter"></component>

  
子组件里面
 computed: {
    authInfo() {
      return this.$parent.authInfo;
    }
  },
  watch: {
    authInfo(val, oldVal) {
      // console.log(val, oldVal)

3 另: 想实现  点击后再step往前的方法  就要放到  callback里.

      this.$alert('已经xxxx', {
          confirmButtonText: '确定',
          callback: action => {
             this.active++;
          }
        });

4 正则校验通过后再进行下一步. 

事实证明  clear valid(具体不是这个) 是有效的

这样 绿色的框框也不会带去下一步了~ qwq  好

5 使用svg
这也太容易了吧  天啊 直接用。。。直接用就好了qwq  直接下载svg文件  矢量图 可以用font-size来调控。width的不用qwq

     <svg-icon icon-class="checkfail" 

             class-name="checkfailIcon"></svg-icon>

      注意  前面是文件名 后面是自定义的类名

哎 不会用搜索引擎 不会表达出自己的意思 代码到用时方恨少啊

6 发现 隐藏密码 show-password不能用

自己定义: 

转载地址:http://youti.baihongyu.com/

你可能感兴趣的文章
NG深度学习第二门课作业1-1 深度学习的实践
查看>>
Ubuntu下安装Qt
查看>>
Qt札记
查看>>
我的vimrc和gvimrc配置
查看>>
hdu 4280
查看>>
禁止使用类的copy构造函数和赋值操作符
查看>>
C++学习路线
查看>>
私有构造函数
查看>>
组队总结
查看>>
TitledBorder 设置JPanel边框
查看>>
DBCP——开源组件 的使用
查看>>
抓包工具
查看>>
海量数据相似度计算之simhash和海明距离
查看>>
DeepLearning tutorial(5)CNN卷积神经网络应用于人脸识别(详细流程+代码实现)
查看>>
DeepLearning tutorial(6)易用的深度学习框架Keras简介
查看>>
DeepLearning tutorial(7)深度学习框架Keras的使用-进阶
查看>>
流形学习-高维数据的降维与可视化
查看>>
Python-OpenCV人脸检测(代码)
查看>>
python+opencv之视频人脸识别
查看>>
人脸识别(OpenCV+Python)
查看>>