<!-- 优惠券列表 --> <div style="border:1px solid #FFF;position:relative"> <div class="couponList" v-show="couponFlag"> <el-checkbox-group v-model="checkList" @change="ChooseCouponList"> <div class="coupon-box grid" v-for="item in AccountCouponList" :key="item.id"> <div class="coupon-item-l grid flex_items grid_column flex_center"> <div style="color:#EB3434;font-size:26px;">￥<span style="font-size:56px">{{item.payDiscountValue}}</span></div> <div style="margin-top:10px;font-size:26px">满{{item.payThreshold}}可用</div> </div> <div class="coupon-item-r"> <div class="grid" style="height: 100%;"> <div class="u-2of3" style="height:100%"> <!-- <div style="font-weight:700;padding-left:40px;margin-bottom:15px">{{item.couponName}}</div> --> <div>1111111111</div> <div style="padding-left:40px;font-size:26px">有效期{{(item.expireTime).slice(0, 10)}}</div> </div> <div class="u-1of3" style="height: 100%;;text-align:center"> <!-- <el-checkbox class="custom-checkbox" :label="item.id"></el-checkbox> --> <!-- <img v-if="SelectRadio === index" src="../../assets/gouxuan_youhuiquan.png" alt="勾选"> <img v-else src="../../assets/gouxuan_youhuiquan_n.png" alt="未勾选"> --> </div> </div> </div> </div> </el-checkbox-group> </div> </div> 这段代码写法有没问题, 1111111111div容器的字段,在页面上显示不出来

根据你提供的代码，没有明显的语法错误。不过，有几个可能导致 `<div>1111111111</div>` 不显示的原因：

1. CSS 样式问题：请确保这个 `<div>` 元素的父元素或者其他相关元素没有设置了隐藏、透明度为 0、或者其他可能导致该元素不可见的 CSS 样式。

2. 数据问题：请检查 `AccountCouponList` 数组中的数据是否存在，并且确保 `item.couponName` 的值不为空。如果 `item.couponName` 是空的，那么 `<div>1111111111</div>` 中就不会显示任何内容。

3. 其他代码问题：请检查其他与该元素相关的代码，特别是可能会影响该元素显示的条件语句、指令、事件处理等。

如果以上检查都没有找到问题，你可以尝试在浏览器开发者工具中查看该元素是否存在，并检查是否有其他样式或错误信息影响了其显示。另外，你还可以尝试将该元素放置在其他位置或者与其他元素进行比较，看是否有不同的显示效果。

相关问题

<!-- 优惠券颜色 --> <label class="layui-form-item block relative"> <span class="help-label"><b>优惠券颜色</b>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span> <input type="radio" name="colour" value="0" title="蓝色" checked lay-filter="colour"> <input type="radio" name="colour" value="1" title="红色" lay-filter="colour"> <input type="radio" name="colour" value="2" title="紫色" lay-filter="colour"> <input type="radio" name="colour" value="3" title="黄色" lay-filter="colour"> </label>无论选那个都返回第一个数据错误原因

根据您提供的代码片段，我发现您的单选按钮的名称（name 属性）都是相同的“colour”，这可能是导致问题的原因。请确保每个单选按钮的名称都不同，以便正确地传递表单数据。您可以像这样修改您的代码：

<!-- 优惠券颜色 -->
<label class="layui-form-item block relative">
    <span class="help-label"><b>优惠券颜色</b>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span>
    <input type="radio" name="colour" value="0" title="蓝色" checked lay-filter="colour">
    <input type="radio" name="colour" value="1" title="红色" lay-filter="colour1">
    <input type="radio" name="colour" value="2" title="紫色" lay-filter="colour2">
    <input type="radio" name="colour" value="3" title="黄色" lay-filter="colour3">
</label>

在上面的代码中，我将第二个单选按钮的名称更改为“colour1”，第三个单选按钮的名称更改为“colour2”，第四个单选按钮的名称更改为“colour3”，以确保每个单选按钮的名称都不同。您可以根据需要进行修改。

<div class="right"> <span>券后价：</span> <el-input v-model="priceMin" placeholder="￥" :max="999" />~ <el-input v-model="priceMax" placeholder="￥" :max="999" /> </div>太宽了input然后中间的~要自适应

如果你想让输入框宽度自适应，并且让中间的`~`自适应位置，你可以使用Flex布局来实现。修改代码如下：

<div class="right" style="display: flex; align-items: center;">
  <span style="margin-right: 5px;">券后价：</span>
  <el-input
    v-model="priceMin"
    placeholder="￥"
    :max="999"
    style="width: auto;"
  />
  <span style="margin: 0 5px;">~</span>
  <el-input
    v-model="priceMax"
    placeholder="￥"
    :max="999"
    style="width: auto;"
  />
</div>

通过设置`display: flex`来启用Flex布局，并使用`align-items: center`来垂直居中对齐。然后，将输入框的宽度设置为`auto`，这样它们就会自适应宽度。中间的`~`使用了`margin`来控制间距。你可以根据需要调整`margin`的值来达到你想要的效果。