使用 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>
        );
    }
};