使用 Vue JSX 时传递道具

我们有一个父组件：在其中导入子组件，我们将通过属性传递道具。这里的属性是’src’，我们也传递’src’。

ParentComponent.js

import ChildComponent from './ChildComponent';
export default {
    render(h, {props}) {
        const src = 'https://cdn-images-1.medium.com/max/800/1*AxRXW2j8qmGJixIYg7n6uw.jpeg';
        return (
           <ChildComponent src={src} />   
        );
    }
};

还有一个子组件，我们需要传递道具。我们需要指定我们传递的道具。

ChildComponent.js：

export default {
    props: ['src'],
    render(h, {props}) {
        return ( 
            <a href = {props.src} download = "myimage" >
                Click this link
            </a>
        );
    }
};