vue element组件实现表单、联动进度条（好用）

输入之后进度条会加进度，删除后进度条会减回去

 1.引入引入 Element

 在 main.js 中加入入以下内容：

import ElementUI from 'element-ui';
import 'element-ui/lib/theme-chalk/index.css';
Vue.use(ElementUI);

2.在views文件夹里创建Wenjuan.vue文件,并在router文件夹的index.js里设置路由

Wenjuan.vue里的内容：

<template>
  <div>
    <div class="wj_box">
      <div class="index">
        <el-progress
          style="margin-left: 1.4rem;"
          :percentage="percentage"
          status="success"
          :color="customColor"
        ></el-progress>
      </div>
      <div class="wj_img">
        <img src="/img/background_4.png" alt="" />
        <div class="wj_count">
          <h3 style="text-align: center">腾讯2022校园招聘宣讲会报名</h3>
          <span
            >同学你好，诚邀你参加腾讯2022校园招聘宣讲会！现场将为你揭秘多面鹅厂，解锁超多应聘干货，更有精美礼品及鹅厂周边等你来拿~欢迎填写问卷报名预约宣讲会（我们将对你的个人信息严格保密）</span
          >
          <div>
            <el-form
              :model="ruleForm"
              :rules="rules"
              ref="ruleForm"
              label-width="100px"
              class="demo-ruleForm"
            >
              <el-form-item label="你的学校" prop="name">
                <el-input
                  v-model