<h3>PIN: {{ pin }}</h3>定义了pin值，在按钮中改变了值，但是界面还是默认值。具体代码在图中。我不用功<script lang="ts">正常使用<script>就没问题
在Vue.js项目中，要动态改变界面的显示，可以使用Vue.js提供的双向数据绑定和条件渲染等特性。具体地，
1. 双向数据绑定：Vue.js提供了v-model指令实现表单元素和数据模型之间的双向绑定，通过修改数据模型的值可以动态更新表单元素的值，反之亦然，从而动态改变界面显示。
2. 条件渲染：Vue.js提供了v-if、v-else-if、v-else等指令实现根据不同条件动态渲染和显示组件或元素。通过修改数据模型的值，可以动态切换组件或元素的显示和隐藏，实现动态改变界面的效果。
3. 计算属性：Vue.js提供了计算属性，可以根据数据模型的变化计算出新的属性值，从而动态改变界面的显示。计算属性具有缓存机制，只有依赖的数据发生变化时才会重新计算，提高了性能。
4. 监听器：Vue.js提供了watch选项，可以监听某个数据模型的变化，并在变化时执行指定的回调函数，从而动态改变界面的显示。
综上所述，Vue.js提供了多种方式实现动态改变界面显示的功能，可以根据具体的需求选择合适的方式来实现。
1. 双向数据绑定：Vue.js提供了v-model指令实现表单元素和数据模型之间的双向绑定，通过修改数据模型的值可以动态更新表单元素的值，反之亦然，从而动态改变界面显示。
2. 条件渲染：Vue.js提供了v-if、v-else-if、v-else等指令实现根据不同条件动态渲染和显示组件或元素。通过修改数据模型的值，可以动态切换组件或元素的显示和隐藏，实现动态改变界面的效果。
3. 计算属性：Vue.js提供了计算属性，可以根据数据模型的变化计算出新的属性值，从而动态改变界面的显示。计算属性具有缓存机制，只有依赖的数据发生变化时才会重新计算，提高了性能。
4. 监听器：Vue.js提供了watch选项，可以监听某个数据模型的变化，并在变化时执行指定的回调函数，从而动态改变界面的显示。
综上所述，Vue.js提供了多种方式实现动态改变界面显示的功能，可以根据具体的需求选择合适的方式来实现。
温馨提示：答案为网友推荐，仅供参考
