项目中遇到的html标签属性用单引号导致标签无法被编译问题

本文链接：https://blog.youkuaiyun.com/Sept_16R/article/details/121183190

在项目开发中，遇到一个问题：HTML标签的disabled属性使用单引号导致在测试环境无法正常编译。虽然在本地环境运行无误，但最终发现解决方案是将disabled属性的外部引号改为双引号。这个问题看似简单却耗费了一定时间，通过分享这个经验，希望能帮助遇到类似问题的开发者避坑。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

先简述一下遇到的问题吧，很简单的问题卡了好久
在进行项目过程中，因为html标签属性用了单引号包裹，导致标签无法编译，但是蹊跷的是在本地是没问题的，在测试环境中就会出现如下图所示场景，虽然最后找到原因解决了，但是还是没总结出官方解释，有大佬知道原因可以评论分享下，写个文章跟大家分享下，帮有需要的人填个坑

            <td class="formTitle">{{$t("product.合同方式")}}<span>*</span></td>
            <td class="formValue">
                <label class="radio-inline" v-for="(item,index) in contractAmountType" :key="index">
                    <input type="radio" :value="index" v-model="params.contract_amount_type" :disabled='index != "SAME_FEE_PAYMENT_TYPE" '/>{{item}}
                </label>
            </td>

如上代码出现问题如下图
在这里插入图片描述
最后解决办法也很让人无奈
disabled属性最外层嵌套用双引号，就问题解决了，平时不注意的小细节，卡了好久，记录一下，分享给大家，希望能长个经验

            <td class="formTitle">{{$t("product.合同方式")}}<span>*</span></td>
            <td class="formValue">
                <label class="radio-inline" v-for="(item,index) in contractAmountType" :key="index">
                    <input type="radio" :value="index" v-model="params.contract_amount_type" :disabled="index != 'SAME_FEE_PAYMENT_TYPE' "/>{{item}}
                </label>
            </td>