vue实现输入后自动计算并显示

例如三个框 ：输入两个值，然后第三个只读框里会根据公式自动算出值并展现出来。这个要怎么来实现 vue中

1.利用vue 计算属性 computed：会根据监听到你前面两个值是否发生变化，发生变化就会自动算出结果（建议这种），会依赖缓存
2.监听属性也是可以的 watch：与上面的区别就是，每次都要重新进行计算（消耗性能）
https://www.runoob.com/vue2/vue-computed.html
https://www.runoob.com/vue2/vue-watch.html

用个form表单，使用双向绑定前两个值，第三个框用一个方法把计算的值return出来赋值即可

<template>
    <view>
        <input v-model="a" @input="changeA"/>
        <input v-model="b" @input="changeB" />
        <input v-model="val" />
    </view>
</template>

<script>
    export default {
        data() {
            return {
                a:0,
                b:0,
                val:0
            }
        },
        methods: {
            changeA(){
                this.gs()
            },
            changeB(){
                this.gs()
            },
            gs(){
                this.val = parseInt(this.a)+parseInt(this.b) //想乘法就*想减就- 
            }
        },
    }
</script>

<style>
    
</style>

https://cn.vuejs.org/v2/guide/computed.html#%E8%AE%A1%E7%AE%97%E5%B1%9E%E6%80%A7%E7%9A%84-setter