使用<view :class="'red'"></view>可生效
但使用<view :class="testMethods"></view>却不生效此时testMethods 返回值为'green'
<template>
<view class="content">
<view >二维码数据是：{{result}}</view>
<button class="btn" type="primary" @tap="open"></button>
<view :class="'red'"></view>
</view>
</template>
<script>
export default {
data() {
return {
text: '请将二维码放入框内，即可自动扫描',
type:'scan-listener',
result:'',//获取到的二维码内容，根据自己需求处理结果
systemInfo:{},
status:1,
green:'#ff0000',
}
},
methods: {
open() {
},
testMethods(){
var _status = this.status;
console.log("_status"+_status);
var ret = '';
if(_status == 1){
ret = "'green'"
}else if(_status == 2){
ret = "'red'"
}else if(_status == 3){
ret = "'black'"
}else{
ret = "'blue'"
}
console.log("ret ="+ ret);
return ret;
}
},
//'../add_device/scancode/scancode?text=' + this.text + '&type=' + this.type,
onReady() {
// #ifdef APP-PLUS
// #endif
},
onLoad() {
// #ifdef APP-PLUS
this.$eventHub.$on(this.type, function(data) {
console.log(data);
this.text = data;
});
// #endif
},
onBackPress() {
// #ifdef APP-PLUS
plus.screen.lockOrientation('portrait-primary')
// #endif
},
onShow() {
}
} </script>
<style>
.test-img{
width: 248rpx;
height: 248rpx;
background-image: '/static/720/gateway.png';
}
.content{
width: 100%;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
.green{
width: 100rpx;
height: 100rpx;
background: #09BB07;
}
.red{
width: 100rpx;
height: 100rpx;
background: #FF0000;
}
.blue{
width: 100rpx;
height: 100rpx;
background: #4272FF;
}
.black{
width: 100rpx;
height: 100rpx;
background: #000000
;
}
.btn{
width: 50%;
}
</style>
