Vue——vue实例方法、属性

import Vue from 'vue'

const app = new Vue({
  // el: '#root',
  template: '<div ref="div">{{text}} {{obj.a}}</div>',
  data: {
    text: 0,
    obj:{}
  },
  // watch: {
  //   text(newText , old){
  //     console.log(`${newText}:${old}`)
  //   }
  // }
})

app.$mount('#root')

app.text = 0

let i=0;
setInterval(()=>{
  // i++;
  // app.$set(app.obj,'a',i)
  // app.$delete()

  // 或者使用强制更新
  // app.obj.a=i;
  // app.$forceUpdate()

  // app.text+=1;
},1000)

// console.log(app.$root === app) //true
// console.log(app.$data)
// console.log(app.$props) //父组件传过来的数据
// console.log(app.$el)  //挂载的节点
// console.log(app.$options) //new Vue实例时的参数对象+默认值

// //重新渲染时生效
// app.$options.render=(h)=>{
//   return h('div',{},'new render func')
// }

// console.log(app.$children) //组件下 标签

// //插槽
// console.log(app.$slots)
// console.log(app.$scopedSlots)

// console.log(app.$refs) //快速定位到模板ref=""中的(html节点对象/组件实例vue实例)
// console.log(app.$isServer)//服务端渲染时使用


//返回注销方法,需要自己注销 unWatch()
// const unWatch=app.$watch('text', (newText , old)=> {
//   console.log(`${newText}:${old}`)
// })


// app.$on('test',(...rest)=>{
//   console.log(`test emit ${rest} `)
// })

// app.$once('test',(...rest)=>{
//   console.log(`test emit ${rest} `)
// })

// setInterval(()=>{app.$emit('test',1,2)},1000)

//app.$forceUpdate() //强制渲染

//app.$nextTick(callback)  //在vue下一次dom更新时执行回调函数
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值