What I will talk about is some code of function mountElement in this file.
Background:
I am trying to use Vue3 as A FrontEnd DSL for Weex, just use @vue/compiler-sfc, @vue/runtime-core and weex-vue-loader(forked from the latest vue-loader) to reach the goal.
Problem
This problem occurs when I resolve the <style> tag with the loader. My solution has two steps:
Generate an object from <style> tag content with the component scopeId, and inject it to the runtime Weex document instance object in the weex-vue-loader(forked from the latest vue-loader), just like this:
Custom the patchProp and nodeOps to createRenderer function of @vue/runtime-core, so I can set the style object to an element using the scopeId as the unique key of its component. Some Code like this:
export constnodeOps: Omit<RendererOptions<WeexNode,WeexElement>,'patchProp'>={insert: (child,parent,anchor)=>{...},remove: child=>{...},// this onesetScopeId(el,id){el.setAttr('id',id)}}
export constpatchProp: DOMRendererOptions['patchProp']=(el,key,prevValue,nextValue,isSVG=false,prevChildren,parentComponent,parentSuspense,unmountChildren)=>{if(key==='class'){patchClass(el,nextValue)}
...
}exportfunctionpatchClass(el: WeexElement,value: string|null){constclassList=processClassStr(value);// array of class, like ['title']// get the unique style object from weex document instance by scopeIdconststyleObj=Object.assign({},
...(classList.map(item=>(weex.document.styleSheets[el.scopeId+'-'+item]// Wow, I can't get the scopeId)))// set the full style object to the elementel.setStyles(styleObj)}
More description
From the demo code above, patchClass runs before setScopeId, so I can't get the scopeId in patchClass. And it is just because props initiates before setScopeId in mountElement . file path
What does the proposed API look like?
So I want to ask if it is possible to exchange the order of props initiate and setScopeId, like the image below.
The text was updated successfully, but these errors were encountered:
What problem does this feature solve?
What I will talk about is some code of function
mountElement
in this file.Background:
I am trying to use Vue3 as A FrontEnd DSL for Weex, just use
@vue/compiler-sfc
,@vue/runtime-core
andweex-vue-loader
(forked from the latest vue-loader) to reach the goal.Problem
This problem occurs when I resolve the <style> tag with the loader. My solution has two steps:
weex-vue-loader
(forked from the latest vue-loader), just like this:patchProp
andnodeOps
tocreateRenderer
function of@vue/runtime-core
, so I can set the style object to an element using thescopeId
as the unique key of its component. Some Code like this:More description
From the demo code above,
patchClass
runs beforesetScopeId
, so I can't get thescopeId
inpatchClass
. And it is just becauseprops
initiates beforesetScopeId
inmountElement
. file pathWhat does the proposed API look like?
So I want to ask if it is possible to exchange the order of
props initiate
andsetScopeId
, like the image below.The text was updated successfully, but these errors were encountered: