Vue实现原理剖析简单实现MVVM框架

如果你想了解如何实现MVVM(Model-View-ViewModel)模式,Vue 的实现原理可以给你不少启发。这里通过剖析Vue的双向绑定原理,带你一步步实现一个MVVM框架。嗯,虽然讲原理会有点抽象,但代码实现起来却挺直观的,尤其是把项目改造成基于Webpack打包的方式,简直是锦上添花。你可以通过npm安装相关的依赖,像webpack-dev-serverbabel-loader等,在本地跑起来。要是你刚开始接触这些工具,也可以先按照教程一步步操作,没什么难度。具体步骤简单,比如:

npm install webpack-dev-server webpack-merge --save-dev
npm run build
进行构建,再用
npm run dev
启动开发服务器就可以了。,想学MVVM模式的话,这篇教程的代码适合上手操作,手动实现个双向绑定,效果还是蛮有趣的!

如果你对如何使用VueWebpack搭配有兴趣,这个项目也了好的参考。在实际开发中,你完全可以将它们结合,做出更复杂的功能。

zip
mvvm-master.zip 预估大小:30个文件
folder
mvvm-master 文件夹
file
webpack.config.js 773B
folder
src 文件夹
folder
shared 文件夹
file
util.js 1KB
folder
core 文件夹
folder
util 文件夹
file
env.js 87B
file
debug.js 232B
file
error.js 352B
file
index.js 126B
file
lang.js 370B
folder
instance 文件夹
file
state.js 5KB
file
index.js 557B
file
init.js 386B
folder
observer 文件夹
file
dep.js 1KB
file
index.js 2KB
file
watcher.js 5KB
file
index.js 213B
folder
compiler 文件夹
file
index.js 5KB
file
.babelrc 158B
folder
example 文件夹
file
index.html 171B
file
main.js 619B
folder
build 文件夹
file
webpack.dev.conf.js 794B
file
devServer.js 481B
file
webpack.doc.conf.js 439B
file
webpack.base.conf.js 401B
folder
dist 文件夹
file
mvvm.min.js 10KB
file
mvvm.js 32KB
folder
docs 文件夹
file
index.html 225B
file
app.js 10KB
file
app.js.map 77KB
file
.gitignore 46B
file
readme.md 766B
file
package.json 1KB
zip 文件大小:53.84KB