做了个星星的评分组件,但是一直就报出警告,如图中的两个警告怎么解决?如图:
代码如下:
<!--components/stars/stars.wxml-->
<view class="rate-group">
<image class="rate-image" style="width:{{starsize}}rpx;height:{{starsize}}" wx:for="{{lights}}" wx:key="key" src="../../images/rate-light.png" />
<image class="rate-image" style="width:{{starsize}}rpx;height:{{starsize}}" wx:for="{{hafls}}" wx:key="key" src="../../images/rate-half.png" />
<image class="rate-image" style="width:{{starsize}}rpx;height:{{starsize}}" wx:for="{{grays}}" wx:key="key" src="../../images/rate-gray.png" />
<text wx:if="{{istext}}" class="rate-text" style="font-size:{{fontsize}}rpx;color:{{fontcolor}}" >{{ratetext}}</text>
</view>
// components/stars/stars.ts
properties: {
rate: {
type: Number,
value: 0,
observer(){
//newVal,oldVal,changedPath
//属性被改变时执行的函数(可选),也可以写成在methods段中定义的方法名字符串,如:'_propertyChange'
//通常newVal就是新设置的数据,oldVal是旧数据
this.updateRate();
}
},
starsize: {
type: Number,
value: 20 //rpx
},
fontsize: {
type: Number,
value: 20 //rpx
},
fontcolor: {
type: String,
value: "#ccc"
},
istext: {
type: Boolean,
value: true
},
},
lifetimes: {
attached: function () {
this.updateRate()
}
},
methods: {
updateRate:function(){
var that = this;
// console.log(that.properties.rate);
var rate = that.properties.rate;
var intRate = parseInt((rate).toString());
var light = parseInt((intRate / 2).toString());
var hafl = intRate % 2;
var gray = 5 - light - hafl;
var lights = [];
var hafls = [];
var grays = [];
for (var index = 1; index <= light; index++) {
lights.push(index);
}
for (var index = 1; index <= hafl; index++) {
hafls.push(index);
}
for (var index = 1; index <= gray; index++) {
grays.push(index);
}
var ratetext = rate && rate > 0 ? rate.toFixed(1) : "未评分";
that.setData({
lights: lights,
hafls: hafls,
grays: grays,
ratetext: ratetext
})
}
}
<!--index.wxml-->
<stars rate="{{item.rating.value}}"></stars>
(7) [{…}, {…}, {…}, {…}, {…}, {…}, {…}]
0:
actions: []
actors: (3) ["雷佳音", "张国立", "于和伟"]
card_subtitle: "2023 / 中国大陆 / 剧情 动作 犯罪 / 张艺谋 / 雷佳音 张国立"
comments: [{…}]
cover: {url: "https://img2.doubanio.com/view/photo/m_ratio_poster/public/p2896319483.jpg", width: 2126, shape: "rectangle", height: 2976}
date: null
description: ""
directors: ["张艺谋"]
has_linewatch: false
id: "33447633"
info: "中国大陆 / 剧情 动作 犯罪 / 张艺谋 / 雷佳音 张国立"
interest: null
label: null
null_rating_reason: ""
original_price: null
original_title: ""
price: null
rating: {count: 175346, max: 10, value: 6.3, star_count: 3}
rating_data: {stats: Array(5), type_ranks: Array(2)}
release_date: "09.28"
onLoad: function (options) {
var that = this
wx.request({ url:"https://m.douban.com/rexxar/api/v2/subject_collection/movie_showing/items?count=7",
success:function(res){
// console.log(res);
var movies = res.data.subject_collection_items;
console.log(movies);
that.setData({
movies:movies
})
}
这个在js里怎么赋值的?
(7) [{…}, {…}, {…}, {…}, {…}, {…}, {…}]
0:
actions: []
actors: (3) ["雷佳音", "张国立", "于和伟"]
card_subtitle: "2023 / 中国大陆 / 剧情 动作 犯罪 / 张艺谋 / 雷佳音 张国立"
comments: [{…}]
cover: {url: "https://img2.doubanio.com/view/photo/m_ratio_poster/public/p2896319483.jpg", width: 2126, shape: "rectangle", height: 2976}
date: null
description: ""
directors: ["张艺谋"]
has_linewatch: false
id: "33447633"
info: "中国大陆 / 剧情 动作 犯罪 / 张艺谋 / 雷佳音 张国立"
interest: null
label: null
null_rating_reason: ""
original_price: null
original_title: ""
price: null
rating: {count: 175346, max: 10, value: 6.3, star_count: 3}
rating_data: {stats: Array(5), type_ranks: Array(2)}
release_date: "09.28"
onLoad: function (options) {
var that = this
wx.request({ url:"https://m.douban.com/rexxar/api/v2/subject_collection/movie_showing/items?count=7",
success:function(res){
// console.log(res);
var movies = res.data.subject_collection_items;
console.log(movies);
that.setData({
movies:movies
})
}
});
}