Translating 504 words of Facebook React

in #utopian-io7 years ago

Translating 504 words of Facebook React


Today I finished translating implementation-notes.md from 44% to 55% total of 504 words.
Capture_2017_12_21_16_33_09_753.png

You may check my activity on this link: https://crowdin.com/project/react/fil/activity

  • And here are the few Examples of my translation:

Ngayon, ang pagpapagana ng unmountTree(), o pagpapagana ng mountTree() ng paulitulit, ay nag tatangal ng lumang tree at pinapagana ang componentWillUnmount() ng lifcycle hook sa mga komponent. implementation-notes.md 03:32 AM
function mountTree(element, containerNode) { // Wasakin ang anumang umiiral na tree if (containerNode.firstChild) { unmountTree(containerNode); } // Gumawa ng top-level na panloob na instance var rootComponent = instantiateComponent(element); // Mag-mount ng top-level na komponent sa isang konteyner var node = rootComponent.mount(); containerNode.appendChild(node); // I-save ang reperensya sa panloob na instance node._internalInstance = rootComponent; // Ibalik ang pangpublikong instance na ibinigay nito var publicInstance = rootComponent.getPublicInstance(); return publicInstance; } implementation-notes.md 03:30 AM
Amin ding tuturuan ang mountTree() na wasakin ang anumang umiiral na tree kaya matatawag ito ng makailang ulit: implementation-notes.md 03:28 AM
Aming babaguhin ang mountTree() para magdagdag ng _internalInstance na katangian sa isang root ng node ng DOM. implementation-notes.md 03:27 AM
Para mapagana ito, kailangan naming basahin ang panloob na root instance mula sa isang node ng DOM. implementation-notes.md 03:26 AM
function unmountTree(containerNode) { // Basahin ang panloob na instance mula sa isang node ng DOM: // (Ito ay hindi pagumagana, kinakailangan pa naming baguhin ang mountTree() para mai-imbak ito.) var node = containerNode.firstChild; var rootComponent = node._internalInstance; // I-unmount ang tree at linisin ang konteyner rootComponent.unmount(); containerNode.innerHTML = ''; } implementation-notes.md 03:25 AM
Kami ay makapagdaragdag na ng mga bagong top-level na punsyon na tinatawag na unmountTree(containerNode) na kapareho ng ReactDOM.unmountComponentAtNode(): implementation-notes.md 03:24 AM
Sa praktika, ang pag-unmount ng mga komponent ng DOM ay nakapag tatangal din ng mga event listeners at nililinis ang ilang mga cache, ngunit aming nilalagpasan ang mga gayong detalye. implementation-notes.md 03:22 AM
class DOMComponent { // ... unmount() { // I-unmount lahat ng children var renderedChildren = this.renderedChildren; renderedChildren.forEach(child => child.unmount()); } } implementation-notes.md 12:46 AM
Para sa DOMComponent, ang pag-unmount ay nag sasabi sa bawat child na mag-unmount: implementation-notes.md 12:46 AM
unmount() { // Tawagin ang lifecycle na hook kung kinakailangan var publicInstance = this.publicInstance; if (publicInstance) { if (publicInstance.componentWillUnmount) { publicInstance.componentWillUnmount(); } } // I-unmount ang nag iisang na-render na komponent var renderedComponent = this.renderedComponent; renderedComponent.unmount(); } } implementation-notes.md 12:45 AM
class CompositeComponent { // ... implementation-notes.md 12:45 AM
Ngayon na mayroon na tayong panloob na mga instance na humahawak sa kanilang mga children at mga node ng DOM, maari na tayong mag implementa ng unmounting. Sa isang composite na komponent, ang unmounting ay tumatawag ng lifecycle na hook at mga recurse. implementation-notes.md 12:45 AM
function mountTree(element, containerNode) { // Gumawa ng top-level na panloob na instance var rootComponent = instantiateComponent(element); // I-mount ang top-level na komponent sa konteyner var node = rootComponent.mount(); containerNode.appendChild(node); // Ibalik ang pang publikong instance na ibinigay nito var publicInstance = rootComponent.getPublicInstance(); return publicInstance; } var rootEl = document.getElementById('root'); mountTree(<App />, rootEl); implementation-notes.md 12:43 AM
Nag babalik ito ng pang publikong instance, katilad din ng ReactDOMrender(): implementation-notes.md 12:39 AM
[object CompositeComponent] { currentElement: <App />, publicInstance: null, renderedComponent: [object CompositeComponent] { currentElement: <Button />, publicInstance: [object Button], renderedComponent: [object DOMComponent] { currentElement: <div />, node: [object HTMLDivElement], renderedChildren: [] } } } implementation-notes.md 12:39 AM
Para mailarawan ito, kung ang punsyon na <App> na komponent ay nag-rerender ng <Button> na class na komponent, at ang Button na nag rerender ng class ay <div>, ang panloob na instance tree ay kahawig nito: implementation-notes.md 12:39 AM
Bilang resulta, bawat panloob na instance, composite o host, ngayon ay pumupunto sa kanilang chald internal na mga instance. implementation-notes.md 12:37 AM
Amin ding ginagamit sila sa pag-aaply ng hindi-makapinsalang mga update sa hinaharap. implementation-notes.md 12:36 AM
Ang pangunahing diperansya pagkatapos ng refactoring mula sa mountHost() ay amin nang pinapanatili ang this.node at this.renderedChildren na nakaugnay sa panloob na instance ng komponent ng DOM. implementation-notes.md 12:36 AM
var renderedChildren = children.map(instantiateComponent); this.renderedChildren = renderedChildren; // Kolektahin ang mga node ng DOM na kanilang ibinalik sa mount var childNodes = renderedChildren.map(child => child.mount()); childNodes.forEach(childNode => node.appendChild(childNode)); // Ibalik ang DOM bilang isang resulta ng mount return node; } }



Posted on Utopian.io - Rewarding Open Source Contributors

Sort:  

Thank you for the contribution. It has been approved.

You can contact us on Discord.
[utopian-moderator]

wow it verry good

Hey @ruah I am @utopian-io. I have just upvoted you!

Achievements

  • Seems like you contribute quite often. AMAZING!

Suggestions

  • Contribute more often to get higher and higher rewards. I wish to see you often!
  • Work on your followers to increase the votes/rewards. I follow what humans do and my vote is mainly based on that. Good luck!

Get Noticed!

  • Did you know project owners can manually vote with their own voting power or by voting power delegated to their projects? Ask the project owner to review your contributions!

Community-Driven Witness!

I am the first and only Steem Community-Driven Witness. Participate on Discord. Lets GROW TOGETHER!

mooncryption-utopian-witness-gif

Up-vote this comment to grow my power and help Open Source contributions like this one. Want to chat? Join me on Discord https://discord.gg/Pc8HG9x

Coin Marketplace

STEEM 0.17
TRX 0.15
JST 0.028
BTC 58148.81
ETH 2345.69
USDT 1.00
SBD 2.35