-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
付鑫
committed
Apr 27, 2018
1 parent
c74ae36
commit fcd6190
Showing
19 changed files
with
815 additions
and
1 deletion.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,13 @@ | ||
{ | ||
"presets": [ | ||
["env", { | ||
"targets": { | ||
"browsers": [ | ||
"last 2 versions", | ||
"safari >= 7" | ||
] | ||
}, | ||
"debug": true | ||
}] | ||
] | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,3 @@ | ||
node_modules | ||
|
||
package-lock.json |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1 +1,3 @@ | ||
# Feact | ||
# Feact | ||
|
||
参考自[snabbdom](https://github.com/snabbdom/snabbdom/tree/8079ba78685b0f0e0e67891782c3e8fb9d54d5b8)的实现 |
Large diffs are not rendered by default.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,15 @@ | ||
<html lang="en"> | ||
|
||
<head> | ||
<meta charset="UTF-8"> | ||
<meta name="viewport" content="width=device-width, initial-scale=1.0"> | ||
<meta http-equiv="X-UA-Compatible" content="ie=edge"> | ||
<title>Document</title> | ||
</head> | ||
|
||
<body> | ||
<div id="container"></div> | ||
<script src="./dist/main.js"></script> | ||
</body> | ||
|
||
</html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,32 @@ | ||
{ | ||
"name": "myreact", | ||
"version": "1.0.0", | ||
"description": "mvvm frameWork", | ||
"main": "index.js", | ||
"scripts": { | ||
"init": "npm install --no-options -s --registry=https://registry.npm.taobao.org", | ||
"dev": "npm run clean && webpack --mode development --progress --profile --colors", | ||
"build": "npm run clean && webpack --mode production --progress --profile --colors", | ||
"clean": "rimraf -rf ./lib" | ||
}, | ||
"author": "fx", | ||
"license": "ISC", | ||
"devDependencies": { | ||
"babel-cli": "^6.26.0", | ||
"babel-core": "^6.26.0", | ||
"babel-loader": "^7.1.4", | ||
"babel-polyfill": "^6.26.0", | ||
"babel-preset-env": "^1.6.1", | ||
"webpack": "^4.5.0", | ||
"webpack-cli": "^2.0.14" | ||
}, | ||
"dependencies": { | ||
"body-parser": "^1.18.2", | ||
"connect": "^3.6.6", | ||
"connect-multiparty": "^2.1.0", | ||
"morgan": "^1.9.0", | ||
"rimraf": "^2.6.2", | ||
"server-static": "^2.0.5", | ||
"up": "^1.0.2" | ||
} | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,31 @@ | ||
/* | ||
* dom转vnode | ||
*/ | ||
import Vnode from './vnode' | ||
export default function (tag, b, c) { | ||
let data = {}, children, text; | ||
if (c !== undefined) { | ||
data = b | ||
if (Array.isArray(c)) { | ||
children = c | ||
} else if (['number', 'string'].includes(typeof c)) { | ||
text = c | ||
} | ||
} else if (b !== undefined) { | ||
if(Array.isArray(c)) { | ||
children = b | ||
} else if (['number', 'string'].includes(typeof b)) { | ||
text = b | ||
} else { | ||
data = b | ||
} | ||
} | ||
if(Array.isArray(children)) { | ||
for(let i = 0; i < children.length; i++) { | ||
if(['number', 'string'].includes(typeof children[i])) { | ||
children[i] = Vnode(undefined, undefined, undefined, children[i]) | ||
} | ||
} | ||
} | ||
return Vnode(tag, data, children, text, undefined) | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,52 @@ | ||
console.log("start----"); | ||
|
||
import { init } from './patch' | ||
import h from './d2V' | ||
|
||
import nClass from './modules/class' | ||
import props from './modules/props' | ||
import style from './modules/style' | ||
|
||
const patch = init([ | ||
nClass, // makes it easy to toggle classes | ||
props, // for setting properties on DOM elements | ||
style, // handles styling on elements with support for animations | ||
]) | ||
|
||
var someFn = function () { | ||
console.log('someFn', arguments); | ||
} | ||
|
||
var anotherEventHandler = function () { | ||
console.log('anotherEventHandler', arguments); | ||
} | ||
|
||
var vnode = h('div#container.two.classes', { on: { click: someFn } }, [ | ||
h('p', { style: { fontWeight: 'bold' } }, 'This is bold'), | ||
' and this is just normal text', | ||
h('a', { props: { href: '/foo' } }, 'I\'ll take you places!') | ||
]); | ||
|
||
console.log('vnode', vnode); | ||
|
||
var newVnode = h('div#container.two.classes', { on: { click: anotherEventHandler } }, [ | ||
h('span', { style: { fontWeight: 'normal', fontStyle: 'italic' } }, 'This is now italic type'), | ||
' and this is still just normal text', | ||
h('a', { props: { href: '/bar' } }, 'I\'ll take you places!') | ||
]); | ||
|
||
console.log('newVnode', newVnode); | ||
|
||
function patchNew(vnode, newVnode) { | ||
// Second `patch` invocation | ||
let n = patch(vnode, newVnode); // Snabbdom efficiently updates the old view to the new state | ||
console.log(n) | ||
} | ||
|
||
window.addEventListener('DOMContentLoaded', () => { | ||
var container = document.getElementById('container'); | ||
|
||
vnode = patch(container, vnode); | ||
|
||
setTimeout(function () { patchNew(vnode, newVnode) }, 2000); | ||
}); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,22 @@ | ||
function updateAttributes(oldVnode, vnode) { | ||
let elm = vnode.elm, oldAttrs = oldVnode.data.attrs, attrs = vnode.data.attrs; | ||
if(!oldAttrs && !attrs) return; | ||
oldAttrs = oldAttrs || {} | ||
attrs = attrs || {} | ||
for(let key of Object.keys(attrs)) { | ||
let cur = attrs[key], old = oldAttrs[key]; | ||
if(old !== cur) { | ||
elm.setAttribute(key, cur) | ||
} | ||
} | ||
for(let key of Object.keys(oldAttrs)) { | ||
if(!elm.hasAttribute(key)) { | ||
elm.removeAttribute(key) | ||
} | ||
} | ||
} | ||
|
||
export default { | ||
create: updateAttributes, | ||
update: updateAttributes | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,10 @@ | ||
function updateClasses(oldVnode, vnode) { | ||
let elm = vnode.elm, oldClass = oldVnode.data.class, nclass = vnode.data.class; | ||
if(!oldClass && !nclass) return; | ||
elm.className = nclass.join(' ') | ||
} | ||
|
||
export default { | ||
create: updateClasses, | ||
update: updateClasses | ||
} |
Empty file.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,22 @@ | ||
function updateProps(oldVnode, vnode) { | ||
let elm = vnode.elm, oldProps = oldVnode.data.props, props = vnode.data.props; | ||
if(!oldProps && !props) return; | ||
oldProps = oldProps || {} | ||
props = props || {} | ||
for(let key of Object.keys(oldProps)) { | ||
if(!props[key]) { | ||
delete elm[key] | ||
} | ||
} | ||
for(let key of Object.keys(props)) { | ||
let cur = props[key], old = oldProps[key]; | ||
if(old !== cur && (key !== 'value' || elm[key] !== cur)) { | ||
elm[key] = cur | ||
} | ||
} | ||
} | ||
|
||
export default { | ||
create: updateProps, | ||
update: updateProps | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,19 @@ | ||
function updateStyle(oldVnode, vnode) { | ||
let elm = vnode.elm, oldStyle = oldVnode.data.style, style = vnode.data.style; | ||
if(!oldStyle && !style) return; | ||
oldStyle = oldStyle || {} | ||
style = style || {} | ||
for(let key of Object.keys(oldStyle)) { | ||
if(!style[name]) { | ||
elm.style[name] = '' | ||
} | ||
} | ||
for(let key of Object.keys(style)) { | ||
elm.style[key] = style[key] | ||
} | ||
} | ||
|
||
export default { | ||
create: updateStyle, | ||
update: updateStyle | ||
} |
Oops, something went wrong.