vue js default prop
props: {
name: {
type: String,
default: 'John Doe'
}
}vue js default prop
props: {
name: {
type: String,
default: 'John Doe'
}
}props vue js
Vue.component('my-component', {
props: {
// Basic type check (`null` and `undefined` values will pass any type validation)
propA: Number,
// Multiple possible types
propB: [String, Number],
// Required string
propC: {
type: String,
required: true
},
// Number with a default value
propD: {
type: Number,
default: 100
},
// Object with a default value
propE: {
type: Object,
// Object or array defaults must be returned from
// a factory function
default: function () {
return { message: 'hello' }
}
},
// Custom validator function
propF: {
validator: function (value) {
// The value must match one of these strings
return ['success', 'warning', 'danger'].indexOf(value) !== -1
}
}
}
})pass method as props vue
//You should probably not pass methods as props in Vue, instead, emit an event.
//In parent component, do for example:
<Child-Component @alert="sayHi" />
methods: {
sayHi() {
alert('Hi')
}
}
// In child component, do:
<element @click="doSomething">
methods: {
doSomething() {
this.$emit('alert')
}
}vue passing props
<!-- Dynamically assign the value of a variable -->
<blog-post v-bind:title="post.title"></blog-post>
<!-- Dynamically assign the value of a complex expression -->
<blog-post
v-bind:title="post.title + ' by ' + post.author.name"
></blog-post>Copyright © 2021 Codeinu
Forgot your account's password or having trouble logging into your Account? Don't worry, we'll help you to get back your account. Enter your email address and we'll send you a recovery link to reset your password. If you are experiencing problems resetting your password contact us
