props改变子组件不更新

今天在开发的时候，碰到一个bug。就是修改了父组件传递给子组件的值，但是子组件接收父组件的props值的时候竟然没有更新视图。举例代码如下：

组件代码

<template>
    <h1>{{ showData }}</h1>
</template>

<script>
export default {
    name: "Son",
    props: {
        Data: {
            type: Number,
            default: 0
        }
    },
    data() {
        return {
            showData: 0
        };
    },
    created() {
        this.showData = this.Data.toFixed(2);
    }
};
</script>

这里props中Data的type是一个Number，代码中在created里面赋值给showData，并做了计算处理，这个初衷是为了不想改变父组件传过来的值，不违反单向数据流传递规则。