需要 alpine.js :value 仅用于计算而不覆盖默认 html 值

Question

所以我正在使用 laravel 8 并使用 alpine.js 为只读字段创建值，该字段将在提交时使用商店中的表单进行处理 method.I 直到现在才成功，因为我现在使用 select 进行输入。相关代码如下所示：

<div class="card-body"
             x-data="{
              bom: parseInt( ''),
              quantity: parseInt( ''),
              total: parseInt( '')
            }">
                    <select class="form-control select2 {{ $errors->has('bom') ? 'is-invalid' : '' }}" name="bom_id" id="bom_id" x-model.number="bom" required>
                            @foreach($bom_value as $key => $value)

                            <option value="{{ $value->id }} {{ old('bom_id') == $value->id ? 'selected' : '' }}" :value="{{ $value->total }}">{{ $value->name }}</option>
                            @endforeach
                    </select>

问题是，当我设置 :value 时，它在 value="{{ $value->id }}" 中显示相同的值，但我需要在那里传递 id，并且只使用 $value->total根据 selected 选择计算该只读输入。我已经检查过并且 $value->id 显示了正确的数据，所有变量也是如此。猜猜是alpine有问题还是我理解有问题

Answer 1

我不太明白你的意思：

and only use $value->total for calculation of that read only input based on selected choice

但是您绝对不应该多次使用任何属性（此处 value）。由于您使用 :value=.. 将值绑定到它，因此您正在销售 AlpineJs 以将您在引号之间传递的值附加到 value 属性。

因此您可以创建一个自定义 data-attribute，比方说 data-value 并将您的值传递给它。然后您可以提取此值并将其附加到只读输入字段。

这对你有帮助吗？

需要 alpine.js :value 仅用于计算而不覆盖默认 html 值

need alpine.js :value to be used just in calculation not to override default html value

laravel-8

alpinejs