如果有新的理解,我会及时更新的,现在还未完全实现Vue的功能,并且期待大佬的批评指点,我必虚心请教,wx:lyglyglyg666666
# 下载
npm install
# 编译打包
npm run build
# 预览
npm run serve
# 测试
npm run test
# 生成测试报告
npm run test:c
实现代码演示(未完)
<script>
new Vue({
el: '#app',
data () {
return {
msg: '<h1>朱昆鹏111</h1>',
age: 21
}
},
methods: {
clickTest () {
alert(`msg是:${this.$data.msg}`)
}
}
})
</script>
实现效果演示
- dist 打包后实现的文件
- vue.js 打包后的Vue文件
- index.html 功能演示文件
- index.js 功能演示JS文件
- src 源文件
- test 测试文件(主要使用Jest进行测试)
- ...
- 模板解析(插值表达式 和 指令)
- 插值表达式解析(解析基础数据绑定)
- v-text
- v-html
- v-model
- v-on
- 发布订阅者模式
- v-model 双向数据绑定
- vm.$data && vm.$methods 挂载到 vm 上
- Vue组件写法
- 基础组件
- slot
- ...
- Vue生命周期
- 虚拟DOM
- Diff算法
- ...
践行TDD ---》 虽然现在写的测试很烂,但是我还是会,不断重构,不断优化,越来越好,越来越严格要求自己