親コンポーネントから渡したデータを子コンポーネントのdata()内で使用したい

実現したいこと

ここに実現したいことを箇条書きで書いてください。

• 親コンポーネントから渡したデータを子コンポーネントのdata()内で使用したい。

前提

ロジックは類似しているが表示させる内容のみを変化させたいファイルが2つあり、親コンポーネントからデータを渡し、子コンポーネントでそれを受け取り表示の切り分けをしたい
該当ソースは、抜粋し添付しています。

該当のソースコード

親コンポーネント(templete部分)

<templete> <Ranking category="men" /> <Ranking category="women" /> </templete>

子コンポーネントdata()部分

props:{ category:{ type: String }, }, data(){ return{ heading:○○○ categoryId:○○○ };

試したこと

○○○の部分に男性であれば『men』、女性であれば『women』のようにデータを入れたいです。
どのようにソースを修正すれば、渡せるようになりますでしょうか。
よろしくお願いします。