a Vue newbie here. I am constructing a navbar-brand element as part of my navbar.
<template>
<!--Navbar-->
<navbar position="top" className="red">
<!-- Navbar brand -->
<navbar-brand></navbar-brand>
...
I would like it to display its child - a string passed in between the tags, if present AND a picture, if the prop.src is not empty. How do I do that - how do I condition the render function? The code is here:
import classNames from 'classnames';
export const props = {
tag: {
type: String,
default: "a"
},
src: {
type: String,
required: true
},
alt: {
type: String,
default: 'brand logo'
},
href: {
type: String,
default: '#'
},
className: {
type: String
}
};
export default {
functional: true,
props,
render(h, { props, data, children }) {
const dataObj = {
class: classNames(
'navbar-brand',
props.className ? props.className : ''
),
attrs: {
href: 'props.href'
}
};
const img = [
h('img', {
class: [],
attrs: {
src: props.src,
alt: props.alt
}
})
];
const
return h(props.tag, dataObj, img);
}
};
PLS HALP
Yours, Paco
Aucun commentaire:
Enregistrer un commentaire