当前位置:Gxlcms > JavaScript > Vue.js的计算属性和数据监听

Vue.js的计算属性和数据监听

时间:2021-07-01 10:21:17 帮助过:66人阅读

这次给大家带来Vue.js的计算属性和数据监听,Vue.js计算属性和数据监听的注意事项有哪些,下面就是实战案例,一起来看一下。

计算属性 computed
需求:把表单输入的内容中,将数字替换掉

<template>
  <div id="myapp">
    {{myValueWithoutNum}}    <br>
    <input type="text" v-model="myValue">
  </div></template><script>
  export default {
    data () {      return {        myValue: ''
      }
    },//    计算属性
    computed: {
      myValueWithoutNum () {//        把输入的数字替换为空
        return this.myValue.replace(/\d/g, '')
      }
    }
  }</script>

1.gif

以上效果

以上就是Vue.js的计算属性和数据监听的详细内容,更多请关注Gxl网其它相关文章!

人气教程排行