我有一个如下所示的父组件，它实现了动态组件切换。挑战在于我想确保索引0处的componentArgs this.components.indexOf(componentArgs[0]) > -1数据有效。行this.components抛出TypeError。
Parent.vue？e9d7：xx Uncaught TypeError：无法读取属性＆＃39; indexOf＆＃39; 未定义的
显然，<template>
<component v-bind:is="currentForm" v-on:switchcomponent="switchComponent"></component>
</template>
<script>
import Login from '@/components/Login'
import Signup from '@/components/Signup'
export default {
name: 'Parent',
components: {
login: Login,
signup: Signup
},
data () {
return {
title: 'Sign Up or Login',
email: '',
currentForm: 'login'
}
},
methods: {
switchComponent: function (componentArgs) {
// componentArgs format: [name, title, email (Use empty string if N/A.)]
let name = 0
let title = 1
let email = 2
console.log('component: ' + componentArgs)
if (this.isValidComponent(componentArgs)) {
this.currentForm = componentArgs[name]
this.title = componentArgs[title]
this.email = componentArgs[email]
}
},
isValidComponent: function (componentArgs) {
let exactLength = 3
if (componentArgs.length === exactLength) {
console.log('components ' + this.components)
if (this.components.indexOf(componentArgs[0]) > -1) {
console.log('component exists')
return true
}
return false
}
return false
}
}
}
</script>
不是访问父组件的正确方法。我该如何做到这一点？
public class Project {
@Id
@GeneratedValue(strategy = GenerationType.IDENTITY)
private long id;
private String city;
private String state;
private String country;
@Enumerated(EnumType.STRING)
private StatusType status;
private String street;
private double latitude;
private double longitude;
@Convert(converter=ProjectPropertyConverter.class)
private ProjectProperty property;
}
public class ProjectProperty {
private String description;
private List<String> projectImgs;
private Boolean hasImages;
}
答案 0 :(得分：1)
可以从
访问components属性this.$options.components
所以你的功能可能是
isValidComponent(name){
return !!this.$options.components[name];
}
其中name是组件的名称。我无法确切地告诉你componentArgs传递了什么。