Alpine.js 的 x-model 指令支持直接绑定到数组中对象的嵌套属性（如 data[index].name），无需使用 x-bind:x-model；错误写法会破坏响应式绑定，导致输入框为空。
alpine.js 的 `x-model` 指令支持直接绑定到数组中对象的嵌套属性（如 `data[index].name`），无需使用 `x-bind:x-model`；错误写法会破坏响应式绑定，导致输入框为空。
在 Alpine.js 中，x-model 是一个指令（directive），而非动态属性——它必须接收一个可响应式的 JavaScript 表达式引用，而非字符串字面量。因此，当你写成 x-bind:x-model="data[${index}].name" 时，实际是将字符串 'data[0].name' 绑定给 x-model 属性，而 Alpine.js 无法解析该字符串为有效路径，最终导致绑定失效、输入框始终为空。
✅ 正确写法是直接使用 JavaScript 表达式（不加引号包裹，也不用 x-bind）：
<template x-for="(item, index) in data" :key="index"><div>
<input type="text" :id="`name_${index}`" :name="`name_${index}`" x-model="data[index].name">
</div>
</template>
? 注意：推荐使用 :id 和 :name（即 x-bind:id 的简写）替代 x-bind:id，更简洁；同时为 x-for 添加 :key="index"（Alpine v3.10+ 推荐）以提升列表更新稳定性。
完整可运行示例：
<div x-data="alpineObject()">
<template x-for="(item, index) in data" :key="index"><div class="mb-2">
<label :for="`name_${index}`">第 {{ index + 1 }} 项名称：</label>
<input type="text" :id="`name_${index}`" :name="`name_${index}`" x-model="data[index].name" class="border px-2 py-1 rounded">
</div>
</template><!-- 实时查看绑定结果 --><pre class="brush:php;toolbar:false;" x-text="JSON.stringify(data, null, 2)">
