Skip to content

Commit

Permalink
feat: add Vue.observable() for explicitly creating observable objects
Browse files Browse the repository at this point in the history
  • Loading branch information
yyx990803 committed Jan 10, 2019
1 parent ce7ca7b commit c50bbde
Show file tree
Hide file tree
Showing 2 changed files with 37 additions and 0 deletions.
7 changes: 7 additions & 0 deletions src/core/global-api/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,7 @@ import { initAssetRegisters } from './assets'
import { set, del } from '../observer/index'
import { ASSET_TYPES } from 'shared/constants'
import builtInComponents from '../components/index'
import { observe } from 'core/observer/index'

import {
warn,
Expand Down Expand Up @@ -44,6 +45,12 @@ export function initGlobalAPI (Vue: GlobalAPI) {
Vue.delete = del
Vue.nextTick = nextTick

// 2.6 explicit observable API
Vue.observable = (obj: any): any => {
observe(obj)
return obj
}

Vue.options = Object.create(null)
ASSET_TYPES.forEach(type => {
Vue.options[type + 's'] = Object.create(null)
Expand Down
30 changes: 30 additions & 0 deletions test/unit/features/global-api/observable.spec.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,30 @@
import Vue from 'vue'

describe('Global API: observable', () => {
it('should work', done => {
const state = Vue.observable({
count: 0
})

const app = new Vue({
render(h) {
return h('div', [
h('span', state.count),
h('button', {
on: {
click: () => {
state.count++
}
}
}, '+')
])
}
}).$mount()

expect(app.$el.querySelector('span').textContent).toBe('0')
app.$el.querySelector('button').click()
waitForUpdate(() => {
expect(app.$el.querySelector('span').textContent).toBe('1')
}).then(done)
})
})

2 comments on commit c50bbde

@oceangravity
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

+1

@syntacticsolutions
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

nice

Please sign in to comment.