问题:
当对初始代码添加了wx.for
和wx.key
初始代码
<view class="tab">
<van-button round type="info" class="tab-item" size="small">豆子</van-button>
</view>
最后代码
<view class="tab">
<van-button wx.for="{{tab_list}}" wx.key="index" round type="info" class="tab-item" size="small">{{item.title}}</van-button>
</view>
添加wx.for
和wx.key
后的最后代码,保存编译出现的错误:
[ WXML 文件编译错误] ./pages/home/index.wxml
unexpected attribute name, near `.for`
9 | </swiper>
10 | <view class="tab">
> 11 | <van-button wx.for="{{tab_list}}" wx.key="index" round type="info" class="tab-item" size="small">{{item.title}}</van-button>
| ^
12 | </view>
13 | </view>
at files://pages/home/index.wxml#11(env: Windows,mp,1.06.2303220; lib: 2.32.0)
[ WXML 文件编译错误] ./pages/home/index.wxml
删除wx.for
后出现的错误:
[自动热重载错误 WXML 文件编译错误] ./pages/home/index.wxml
unexpected attribute name, near `.key`
9 | </swiper>
10 | <view class="tab">
> 11 | <van-button wx.key="index" round type="info" class="tab-item" size="small">{{item.title}}</van-button>
| ^
12 | </view>
13 | </view>
at files://pages/home/index.wxml#11(env: Windows,mp,1.06.2303220; lib: 2.32.0)
原因:
WXML 文件编译错误,组件未被编译
解决:
wx.for
应该改成wx:for
,wx.key
应该改成wx:key
,
更改后:
<view class="tab">
<van-button wx:for="{{tab_list}}" wx:key="index" round type="info" class="tab-item" size="small">{{item.title}}</van-button>
</view>
编译正常
一系列的unexpected attribute name, near问题原因:
一系列的unexpected attribute name, near…问题,都是 WXML 文件编译错误,组件未被编译,那么就需要好好查查自己敲得代码,看看哪里出错,下面举一些例子(源自腾讯的wepy—小程序支持组件化开发的框架的issue)
- 1.
报unexpected attribute name near .sync
-
import CouponList from '../components/couponList.wpy'
中多了文件后缀.wpy
,去掉后缀后import CouponList from '../components/couponList'
*******************
-
-
components = {}
改成components: {}
*******************
-
-
确保你的自定义标签没有下划线或者驼峰的形式,全单字符、字母全小写
*******************
-
-
确保你的自定义标签没有下划线或者驼峰的形式,全单字符、字母全小写
*******************
- 4.
报unexpected attribute name, near \\`.once\`
-
<input type="text" :value="msg" />
.wpy文件转换成.wxml<input type="text" v-bind:value.once="msg"/>
。这里不支持 :value 属性,要 value=“{{msg}}”。