uin-app

xml在html中格式化输出

2020-09-02  本文已影响0人  瑟闻风倾

(1) 示例

<template>
    <view>
        <view class="cells">
            <view class="cell" v-for="(item,index) in logList" :key="index">
                <view class="hd">机器</view>
                <view>
                    <text class="hd">指令</text>
                    <text class="bd">{{item.instruction}}</text>
                </view>
                <view>
                    <text class="hd">时间</text>
                    <text class="bd">{{item.time}}</text>
                </view>
                <view class="hd">内容</view>
                <view class="bd">
                    <pre>
Array
(
    [type] => Server
    [cmd] => setpara
    [cmd_id] => 1598927502
    [devsn] => 19094051422
    [items] => Array
        (
            [P8] => 2
        )
)
                    </pre>
                </view>
            </view>
        </view>
    </view>
</template>

<script>
export default {
    data() {
        return {
            logList:[
                {
                    machineNo:"zj100000013",
                    instruction:"getpara",
                    time:"2020-09-01 10:09:42",
                    content:"Array"
                },
                {
                    machineNo:"zj100000013",
                    instruction:"getpara",
                    time:"2020-09-01 10:09:42",
                    content:"Array"
                },
                {
                    machineNo:"zj100000013",
                    instruction:"getpara",
                    time:"2020-09-01 10:09:42",
                    content:"Array"
                }
            ]
        }
    },
    methods: {
    },
    onLoad:function(){
    }
}
</script>

<style scoped lang="scss">
.cells{
    padding: 0 15px;
    .cell{
        display: flex;
        flex-direction: column;
        border-bottom: 1px solid rgba(0, 0, 0, 0.15);
        .hd{
            color: #000;
            margin-right: 8px;
        }
        .bd{
            color: #888;
        }
    }
}

</style>

(2) 效果


image.png
上一篇 下一篇

猜你喜欢

热点阅读