1

错误

[Vue warn]: Error when evaluating expression ""tunnel-status fa "+this._applyFilters(device.telnet,null,[{"name":"networkIcon","args":[{"value":"telnet","dynamic":false}]}],false)": 
TypeError: Cannot read property 'telnet' of undefined (found in component: <network>)

成分

家长

这是我如何称呼我的子组件（见下文）：

<network :device="device"></network>

该device对象是从我的商店中提取的计算属性：

device() {
    var data = null;

    if (typeof this.networks !== 'undefined' && typeof this.networks[this.site.hostname] !== 'undefined') {
        data = this.networks[this.site.hostname][this.printer.hostname];
    }

    return data;
}

孩子

<template>
    <span class="ping hint--top-right" aria-label="ping: {{ device.ping | currency '' 2 }} ms">
        <i class="tunnel-status fa {{ device.ping | networkIcon 'ping' }}"> </i>
    </span>
    <span class="telnet hint--top-right" aria-label="telnet: {{ device.telnet | currency '' 2 }} ms">
        <i class="tunnel-status fa {{ device.telnet | networkIcon 'telnet' }}"> </i>
    </span>
</template>
<script type="text/ecmascript-6">
    export default {
        props: {
            device: {
                type: Object,
                required: true,
                default: function () {
                    return {
                        ping: null,
                        telnet: null
                    }
                }
            },
        },
        filters: {
            networkIcon: function (probe, type) {
                let icon = 'fa-pulsing fa-fw';

                if (type == 'ping' && probe > 0) {
                    icon = 'fa-check text-success';
                }
                else if (type == 'telnet' && probe > 0) {
                    icon = 'fa-check text-primary';
                }

                return icon;
            }
        }
    }
</script>

问题

store.networks该错误仅在填充对象的请求之前发生一次。当我声明我的道具device默认值时，我没想到会出现这种错误：

default: function () {
    return {
        ping: null,
        telnet: null
    }
}
4

0 回答 0