解决图片验证码不显示的问题

template中代码：

<el-col :span="12">
                    <el-form-item label="图片验证码：" prop="imgCode">
                        <div style="width:100%;height:40px">
                            <el-input v-model="edit.imgCode" type="text" placeholder="请输入图片验证码" class="yanzhengma_input"
                                      style="position:absolute;left: 0px;top:2px;right:0px; width: 160px; height: 39px; line-height: 39px;width: 190px"
                                      @blur="confirmCode" />
                            <div class="code" style="position:absolute;right:10px;top:4px;width: 118px;height: 40px;" @click="refreshCode">
                                <el-image :src="codeImg" style="padding-right: 13px;padding-top: 3px;"/>
                            </div>
                        </div>
                    </el-form-item>
                </el-col>

refreshCode方法：

methods: {
            refreshCode() {
                getCodeImg().then(res => {
                    if (res.success) {
                        this.codeImg = "data:image/png;base64," + res.data.img;
                        this.edit.imageToken = res.data.imgToken;
                        this.$forceUpdate();
                    }
                })

            },
}

注意：要加上 this.$forceUpdate();强制刷新

另外，还要在created中调用该方法：

created() {
            this.refreshCode()
        },

这样就可以保证大部分情况下都能显示图片二维码，偶尔也会出现无法显示的情况。