puyajun@huawei.com

Signed-off-by: puyajun <puyajun@huawei.com>
2026-07-20 19:47:44 -04:00 · 2022-04-06 16:33:11 +08:00
parent 9d06d6b8aa
commit 9deff7c56b
7 changed files with 282 additions and 39 deletions
@@ -37,6 +37,8 @@ export const COMPONENT_CONSUME_DECORATOR: string = '@Consume';
 export const COMPONENT_OBJECT_LINK_DECORATOR: string = '@ObjectLink';
 export const COMPONENT_WATCH_DECORATOR: string = '@Watch';
 export const COMPONENT_BUILDERPARAM_DECORATOR: string = '@BuilderParam';
+export const COMPONENT_LOCAL_STORAGE_LINK_DECORATOR: string = '@LocalStorageLink';
+export const COMPONENT_LOCAL_STORAGE_PROP_DECORATOR: string = '@LocalStorageProp';

 export const COMPONENT_DECORATORS_PARAMS: Set<string> = new Set([COMPONENT_CONSUME_DECORATOR,
  COMPONENT_STORAGE_PROP_DECORATOR, COMPONENT_STORAGE_LINK_DECORATOR, COMPONENT_PROVIDE_DECORATOR,
@@ -46,7 +48,8 @@ export const INNER_COMPONENT_DECORATORS: Set<string> = new Set([COMPONENT_DECORA
 export const INNER_COMPONENT_MEMBER_DECORATORS: Set<string> = new Set([COMPONENT_STATE_DECORATOR,
  COMPONENT_PROP_DECORATOR, COMPONENT_LINK_DECORATOR, COMPONENT_STORAGE_PROP_DECORATOR,
  COMPONENT_STORAGE_LINK_DECORATOR, COMPONENT_PROVIDE_DECORATOR, COMPONENT_CONSUME_DECORATOR,
-  COMPONENT_OBJECT_LINK_DECORATOR, COMPONENT_WATCH_DECORATOR, COMPONENT_BUILDERPARAM_DECORATOR]);
+  COMPONENT_OBJECT_LINK_DECORATOR, COMPONENT_WATCH_DECORATOR, COMPONENT_BUILDERPARAM_DECORATOR,
+  COMPONENT_LOCAL_STORAGE_LINK_DECORATOR, COMPONENT_LOCAL_STORAGE_PROP_DECORATOR]);

 export const COMPONENT_OBSERVED_DECORATOR: string = '@Observed';
 export const COMPONENT_BUILDER_DECORATOR: string = '@Builder';
@@ -109,6 +112,9 @@ export const COMPONENT_CONSTRUCTOR_ID: string = 'compilerAssignedUniqueChildId';
 export const COMPONENT_CONSTRUCTOR_PARENT: string = 'parent';
 export const COMPONENT_CONSTRUCTOR_PARAMS: string = 'params';
 export const COMPONENT_CONSTRUCTOR_UNDEFINED: string = 'undefined';
+export const COMPONENT_CONSTRUCTOR_LOCALSTORAGE: string = 'localStorage';
+export const COMPONENT_SET_AND_LINK: string = 'setAndLink';
+export const COMPONENT_SET_AND_PROP: string = 'setAndProp';

 export const BUILD_ON: string = 'on';
 export const BUILD_OFF: string = 'off';
@@ -48,7 +48,13 @@ import {
  COMPONENT_STYLES_DECORATOR,
  STYLES,
  INTERFACE_NAME_SUFFIX,
-  OBSERVED_PROPERTY_ABSTRACT
+  OBSERVED_PROPERTY_ABSTRACT,
+  COMPONENT_LOCAL_STORAGE_LINK_DECORATOR,
+  COMPONENT_LOCAL_STORAGE_PROP_DECORATOR,
+  COMPONENT_CONSTRUCTOR_LOCALSTORAGE,
+  COMPONENT_SET_AND_LINK,
+  COMPONENT_SET_AND_PROP,
+  COMPONENT_CONSTRUCTOR_UNDEFINED
 } from './pre_define';
 import {
  BUILDIN_STYLE_NAMES,
@@ -59,7 +65,9 @@ import {
 } from './component_map';
 import {
  componentCollection,
-  linkCollection
+  linkCollection,
+  localStorageLinkCollection,
+  localStoragePropCollection
 } from './validate_ui_syntax';
 import {
  addConstructor,
@@ -114,7 +122,7 @@ type BuildCount = {
 function processMembers(members: ts.NodeArray<ts.ClassElement>, parentComponentName: ts.Identifier,
  context: ts.TransformationContext, log: LogInfo[], program: ts.Program, hasPreview: boolean): ts.ClassElement[] {
  const buildCount: BuildCount = { count: 0 };
-  let ctorNode: any = getInitConstructor(members);
+  let ctorNode: any = getInitConstructor(members, parentComponentName);
  const newMembers: ts.ClassElement[] = [];
  const watchMap: Map<string, ts.Node> = new Map();
  const updateParamsStatements: ts.Statement[] = [];
@@ -126,7 +134,7 @@ function processMembers(members: ts.NodeArray<ts.ClassElement>, parentComponentN
  members.forEach((item: ts.ClassElement) => {
    let updateItem: ts.ClassElement;
    if (ts.isPropertyDeclaration(item)) {
-      addPropertyMember(item, newMembers, program);
+      addPropertyMember(item, newMembers, program, parentComponentName.getText());
      const result: UpdateResult = processMemberVariableDecorators(parentComponentName, item,
        ctorNode, watchMap, checkController, log, program, context, hasPreview, interfaceNode);
      if (result.isItemUpdate()) {
@@ -171,7 +179,7 @@ function processMembers(members: ts.NodeArray<ts.ClassElement>, parentComponentN
 }

 function addPropertyMember(item: ts.ClassElement, newMembers: ts.ClassElement[],
-  program: ts.Program):void {
+  program: ts.Program, parentComponentName: string): void {
  const propertyItem: ts.PropertyDeclaration = item as ts.PropertyDeclaration;
  let decoratorName: string;
  let updatePropertyItem: ts.PropertyDeclaration;
@@ -183,6 +191,7 @@ function addPropertyMember(item: ts.ClassElement, newMembers: ts.ClassElement[],
    for (let i = 0; i < propertyItem.decorators.length; i++) {
      let newType: ts.TypeNode;
      decoratorName = propertyItem.decorators[i].getText().replace(/\(.*\)$/, '').trim();
+      let isLocalStorage: boolean = false;
      switch (decoratorName) {
        case COMPONENT_STATE_DECORATOR:
        case COMPONENT_PROVIDE_DECORATOR:
@@ -204,8 +213,15 @@ function addPropertyMember(item: ts.ClassElement, newMembers: ts.ClassElement[],
        case COMPONENT_STORAGE_LINK_DECORATOR:
          newType = ts.factory.createTypeReferenceNode(OBSERVED_PROPERTY_ABSTRACT, [type]);
          break;
+        case COMPONENT_LOCAL_STORAGE_LINK_DECORATOR:
+        case COMPONENT_LOCAL_STORAGE_PROP_DECORATOR:
+          newType = ts.factory.createTypeReferenceNode(OBSERVED_PROPERTY_ABSTRACT, [type ||
+            ts.factory.createKeywordTypeNode(ts.SyntaxKind.UndefinedKeyword)]);
+          isLocalStorage = true;
+          break;
      }
-      updatePropertyItem = createPropertyDeclaration(propertyItem, newType, false);
+      updatePropertyItem = createPropertyDeclaration(propertyItem, newType, false,
+        isLocalStorage, parentComponentName);
      if (updatePropertyItem) {
        newMembers.push(updatePropertyItem);
      }
@@ -214,7 +230,8 @@ function addPropertyMember(item: ts.ClassElement, newMembers: ts.ClassElement[],
 }

 function createPropertyDeclaration(propertyItem: ts.PropertyDeclaration, newType: ts.TypeNode | undefined,
-  normalVar: boolean): ts.PropertyDeclaration {
+  normalVar: boolean, isLocalStorage: boolean = false, parentComponentName: string = null
+  ): ts.PropertyDeclaration {
  if (typeof newType === undefined) {
    return undefined;
  }
@@ -226,7 +243,33 @@ function createPropertyDeclaration(propertyItem: ts.PropertyDeclaration, newType
    ts.factory.createModifier(ts.SyntaxKind.PrivateKeyword);
  return ts.factory.updatePropertyDeclaration(propertyItem, undefined,
    propertyItem.modifiers || [privateM], prefix + propertyItem.name.getText(),
-    propertyItem.questionToken, newType, undefined);
+    propertyItem.questionToken, newType, isLocalStorage ?
+      createLocalStroageCallExpression(propertyItem, propertyItem.name.getText(),
+        parentComponentName) : undefined);
+}
+
+function createLocalStroageCallExpression(node: ts.PropertyDeclaration, name: string,
+  parentComponentName: string): ts.CallExpression {
+  const localStorageLink: Set<string> = localStorageLinkCollection.get(parentComponentName).get(name);
+  const localStorageProp: Set<string> = localStoragePropCollection.get(parentComponentName).get(name);
+  return ts.factory.createCallExpression(
+    ts.factory.createPropertyAccessExpression(
+      ts.factory.createPropertyAccessExpression(
+        ts.factory.createThis(),
+        ts.factory.createIdentifier(`${COMPONENT_CONSTRUCTOR_LOCALSTORAGE}_`)
+      ),
+      ts.factory.createIdentifier(localStorageLink && !localStorageProp ? COMPONENT_SET_AND_LINK :
+        COMPONENT_SET_AND_PROP)
+    ),
+    [node.type],
+    [
+      ts.factory.createStringLiteral(localStorageLink && !localStorageProp ?
+        Array.from(localStorageLink)[0] : Array.from(localStorageProp)[0]),
+      ts.factory.createNumericLiteral(node.initializer ? node.initializer.getText() :
+        COMPONENT_CONSTRUCTOR_UNDEFINED), ts.factory.createThis(),
+      ts.factory.createStringLiteral(name || COMPONENT_CONSTRUCTOR_UNDEFINED)
+    ]
+  );
 }

 function processComponentMethod(node: ts.MethodDeclaration, parentComponentName: ts.Identifier,
@@ -22,22 +22,29 @@ import {
  COMPONENT_CONSTRUCTOR_UPDATE_PARAMS,
  COMPONENT_WATCH_FUNCTION,
  BASE_COMPONENT_NAME,
-  INTERFACE_NAME_SUFFIX
+  INTERFACE_NAME_SUFFIX,
+  COMPONENT_CONSTRUCTOR_LOCALSTORAGE
 } from './pre_define';

-export function getInitConstructor(members: ts.NodeArray<ts.Node>): ts.ConstructorDeclaration {
+import {
+  localStorageLinkCollection,
+  localStoragePropCollection
+} from './validate_ui_syntax';
+
+export function getInitConstructor(members: ts.NodeArray<ts.Node>, parentComponentName: ts.Identifier
+  ): ts.ConstructorDeclaration {
  let ctorNode: any = members.find(item => {
    return ts.isConstructorDeclaration(item);
  });
  if (ctorNode) {
    ctorNode = updateConstructor(ctorNode, [], [], true);
  }
-  return initConstructorParams(ctorNode);
+  return initConstructorParams(ctorNode, parentComponentName);
 }

-export function updateConstructor(ctorNode: ts.ConstructorDeclaration,
-  para: ts.ParameterDeclaration[], addStatements: ts.Statement[], isSuper: boolean = false, isAdd: boolean = false, parentComponentName?: ts.Identifier):
-  ts.ConstructorDeclaration {
+export function updateConstructor(ctorNode: ts.ConstructorDeclaration,para: ts.ParameterDeclaration[],
+  addStatements: ts.Statement[], isSuper: boolean = false, isAdd: boolean = false,
+  parentComponentName?: ts.Identifier): ts.ConstructorDeclaration {
  let modifyPara: ts.ParameterDeclaration[];
  if (para && para.length) {
    modifyPara = Array.from(ctorNode.parameters);
@@ -63,15 +70,22 @@ export function updateConstructor(ctorNode: ts.ConstructorDeclaration,
      ctorPara = addParamsType(ctorNode, modifyPara, parentComponentName);
    }
    ctorNode = ts.factory.updateConstructorDeclaration(ctorNode, ctorNode.decorators,
-      ctorNode.modifiers, ctorPara,
+      ctorNode.modifiers, modifyPara || ctorNode.parameters,
      ts.factory.createBlock(modifyBody || ctorNode.body.statements, true));
  }
  return ctorNode;
 }

-function initConstructorParams(node: ts.ConstructorDeclaration): ts.ConstructorDeclaration {
-  const paramNames: string[] = [COMPONENT_CONSTRUCTOR_ID, COMPONENT_CONSTRUCTOR_PARENT,
-    COMPONENT_CONSTRUCTOR_PARAMS];
+function initConstructorParams(node: ts.ConstructorDeclaration, parentComponentName: ts.Identifier):
+  ts.ConstructorDeclaration {
+  if (!ts.isIdentifier(parentComponentName)) {
+    return;
+  }
+  const localStorageNum: number = localStorageLinkCollection.get(parentComponentName.getText()).size +
+    localStoragePropCollection.get(parentComponentName.getText()).size;
+  const paramNames: Set<string> = new Set([COMPONENT_CONSTRUCTOR_ID, COMPONENT_CONSTRUCTOR_PARENT,
+    COMPONENT_CONSTRUCTOR_PARAMS, localStorageNum ? COMPONENT_CONSTRUCTOR_LOCALSTORAGE :
+      COMPONENT_CONSTRUCTOR_PARAMS]);
  const newParameters: ts.ParameterDeclaration[] = Array.from(node.parameters);
  if (newParameters.length !== 0) {
    // @ts-ignore
@@ -114,13 +128,15 @@ function addParamsType(ctorNode: ts.ConstructorDeclaration, modifyPara: ts.Param
        break;
    }
    newTSPara.push(parameter);
-  })
+  });
  return newTSPara;
 }

 export function addConstructor(ctorNode: any, watchMap: Map<string, ts.Node>,
  parentComponentName: ts.Identifier): ts.ConstructorDeclaration {
  const watchStatements: ts.ExpressionStatement[] = [];
+  const localStorageNum: number = localStorageLinkCollection.get(parentComponentName.getText()).size +
+    localStoragePropCollection.get(parentComponentName.getText()).size;
  watchMap.forEach((value, key) => {
    const watchNode: ts.ExpressionStatement = ts.factory.createExpressionStatement(
      ts.factory.createCallExpression(
@@ -140,8 +156,13 @@ export function addConstructor(ctorNode: any, watchMap: Map<string, ts.Node>,
  });
  const callSuperStatement: ts.Statement = ts.factory.createExpressionStatement(
    ts.factory.createCallExpression(ts.factory.createSuper(), undefined,
+      localStorageNum ?
      [ts.factory.createIdentifier(COMPONENT_CONSTRUCTOR_ID),
-        ts.factory.createIdentifier(COMPONENT_CONSTRUCTOR_PARENT)]));
+        ts.factory.createIdentifier(COMPONENT_CONSTRUCTOR_PARENT),
+        ts.factory.createIdentifier(COMPONENT_CONSTRUCTOR_LOCALSTORAGE)] :
+        [ts.factory.createIdentifier(COMPONENT_CONSTRUCTOR_ID),
+        ts.factory.createIdentifier(COMPONENT_CONSTRUCTOR_PARENT)]
+    ));
  const updateWithValueParamsStatement: ts.Statement = ts.factory.createExpressionStatement(
    ts.factory.createCallExpression(ts.factory.createPropertyAccessExpression(
      ts.factory.createThis(), ts.factory.createIdentifier(COMPONENT_CONSTRUCTOR_UPDATE_PARAMS)),
@@ -50,7 +50,9 @@ import {
  SET_CONTROLLER_CTR_TYPE,
  BASE_COMPONENT_NAME,
  COMPONENT_CREATE_FUNCTION,
-  COMPONENT_BUILDERPARAM_DECORATOR
+  COMPONENT_BUILDERPARAM_DECORATOR,
+  COMPONENT_LOCAL_STORAGE_LINK_DECORATOR,
+  COMPONENT_LOCAL_STORAGE_PROP_DECORATOR
 } from './pre_define';
 import {
  forbiddenUseStateType,
@@ -86,7 +88,8 @@ export const propAndLinkDecorators: Set<string> =
  new Set([COMPONENT_PROP_DECORATOR, COMPONENT_LINK_DECORATOR]);

 export const appStorageDecorators: Set<string> =
-  new Set([COMPONENT_STORAGE_PROP_DECORATOR, COMPONENT_STORAGE_LINK_DECORATOR]);
+  new Set([COMPONENT_STORAGE_PROP_DECORATOR, COMPONENT_STORAGE_LINK_DECORATOR,
+    COMPONENT_LOCAL_STORAGE_LINK_DECORATOR, COMPONENT_LOCAL_STORAGE_PROP_DECORATOR]);

 export const mandatorySpecifyDefaultValueDecorators: Set<string> =
  new Set([...observedPropertyDecorators, ...appStorageDecorators]);
@@ -61,6 +61,10 @@ import {
  GLOBAL_STYLE_FUNCTION,
  INTERFACE_NODE_SET
 } from './component_map';
+import {
+  localStorageLinkCollection,
+  localStoragePropCollection
+} from './validate_ui_syntax'
 import { resources } from '../main';
 import { createCustomComponentNewExpression, createViewCreate } from './process_component_member';

@@ -421,12 +425,35 @@ function createEntryNode(node: ts.SourceFile, context: ts.TransformationContext)

 function createEntryFunction(name: string, context: ts.TransformationContext)
  : ts.ExpressionStatement {
-  return context.factory.createExpressionStatement(context.factory.createCallExpression(
-    context.factory.createIdentifier(PAGE_ENTRY_FUNCTION_NAME), undefined,
-    [context.factory.createNewExpression(context.factory.createIdentifier(name), undefined,
-      [context.factory.createStringLiteral((++componentInfo.id).toString()),
-        context.factory.createIdentifier(COMPONENT_CONSTRUCTOR_UNDEFINED),
-        context.factory.createObjectLiteralExpression([], false)])]));
+  let localStorageName: string;
+  const localStorageNum: number = localStorageLinkCollection.get(name).size +
+    localStoragePropCollection.get(name).size;
+  if (componentCollection.entryComponent === name && componentCollection.localStorageName &&
+    localStorageNum) {
+    localStorageName = componentCollection.localStorageName;
+  } else if (componentCollection.entryComponent === name && !componentCollection.localStorageName
+    && localStorageNum) {
+    transformLog.errors.push({
+      type: LogType.ERROR,
+      message: `@Entry should have a parameter, like '@Entry (storage)'.`,
+      pos: componentCollection.entryComponentPos
+    });
+    return;
+  }
+  const newArray: ts.Expression[] = [
+    context.factory.createStringLiteral((++componentInfo.id).toString()),
+    context.factory.createIdentifier(COMPONENT_CONSTRUCTOR_UNDEFINED),
+    context.factory.createObjectLiteralExpression([], false)
+  ]
+  if (localStorageName) {
+    newArray.push(context.factory.createIdentifier(localStorageName))
+  }
+  const newExpressionStatement: ts.ExpressionStatement =
+    context.factory.createExpressionStatement(context.factory.createCallExpression(
+      context.factory.createIdentifier(PAGE_ENTRY_FUNCTION_NAME), undefined,
+      [context.factory.createNewExpression(context.factory.createIdentifier(name),
+        undefined, newArray)]));
+  return newExpressionStatement;
 }

 export function resetLog(): void {
@@ -37,6 +37,8 @@ import {
  COMPONENT_CONSUME_DECORATOR,
  COMPONENT_OBJECT_LINK_DECORATOR,
  COMPONENT_OBSERVED_DECORATOR,
+  COMPONENT_LOCAL_STORAGE_LINK_DECORATOR,
+  COMPONENT_LOCAL_STORAGE_PROP_DECORATOR,
  STYLES,
  VALIDATE_MODULE,
  COMPONENT_BUILDER_DECORATOR
@@ -61,10 +63,12 @@ import {
 } from './utils';
 import { projectConfig } from '../main';
 import { collectExtend } from './process_ui_syntax';
-import { importModuleCollection } from "./ets_checker";
-import { isExtendFunction } from "./process_ui_syntax";
+import { importModuleCollection } from './ets_checker';
+import { isExtendFunction } from './process_ui_syntax';

 export interface ComponentCollection {
+  localStorageName: string;
+  entryComponentPos: number;
  entryComponent: string;
  previewComponent: string;
  customDialogs: Set<string>;
@@ -83,9 +87,13 @@ export interface IComponentSet {
  provides: Set<string>;
  consumes: Set<string>;
  objectLinks: Set<string>;
+  localStorageLink: Map<string, Set<string>>;
+  localStorageProp: Map<string, Set<string>>;
 }

 export const componentCollection: ComponentCollection = {
+  localStorageName: null,
+  entryComponentPos: null,
  entryComponent: null,
  previewComponent: null,
  customDialogs: new Set([]),
@@ -108,6 +116,8 @@ export const storageLinkCollection: Map<string, Set<string>> = new Map();
 export const provideCollection: Map<string, Set<string>> = new Map();
 export const consumeCollection: Map<string, Set<string>> = new Map();
 export const objectLinkCollection: Map<string, Set<string>> = new Map();
+export const localStorageLinkCollection: Map<string, Map<string, Set<string>>> = new Map();
+export const localStoragePropCollection: Map<string, Map<string, Set<string>>> = new Map();

 export const isStaticViewCollection: Map<string, boolean> = new Map();

@@ -251,6 +261,7 @@ function checkDecorators(decorators: ts.NodeArray<ts.Decorator>, result: Decorat
        case COMPONENT_DECORATOR_ENTRY:
          result.entryCount++;
          componentCollection.entryComponent = componentName;
+          collectLocalStorageName(element);
          break;
        case COMPONENT_DECORATOR_PREVIEW:
          result.previewCount++;
@@ -286,6 +297,21 @@ function checkDecorators(decorators: ts.NodeArray<ts.Decorator>, result: Decorat
  }
 }

+function collectLocalStorageName(node: ts.Decorator): void {
+  if (node && node.expression && ts.isCallExpression(node.expression)) {
+    componentCollection.entryComponentPos = node.expression.pos;
+    if (node.expression.arguments && node.expression.arguments.length) {
+      node.expression.arguments.forEach((item: ts.Node, index: number) => {
+        if (ts.isIdentifier(item) && index === 0) {
+          componentCollection.localStorageName = item.getText();
+        }
+      });
+    }
+  } else {
+    componentCollection.localStorageName = null;
+  }
+}
+
 function checkUISyntax(filePath: string, allComponentNames: Set<string>, content: string,
  log: LogInfo[]): void {
  const sourceFile: ts.SourceFile = ts.createSourceFile(filePath, content,
@@ -619,6 +645,8 @@ function collectComponentProps(node: ts.StructDeclaration): void {
  provideCollection.set(componentName, ComponentSet.provides);
  consumeCollection.set(componentName, ComponentSet.consumes);
  objectLinkCollection.set(componentName, ComponentSet.objectLinks);
+  localStorageLinkCollection.set(componentName, ComponentSet.localStorageLink);
+  localStoragePropCollection.set(componentName, ComponentSet.localStorageProp);
 }

 export function getComponentSet(node: ts.StructDeclaration): IComponentSet {
@@ -632,18 +660,21 @@ export function getComponentSet(node: ts.StructDeclaration): IComponentSet {
  const provides: Set<string> = new Set();
  const consumes: Set<string> = new Set();
  const objectLinks: Set<string> = new Set();
+  const localStorageLink: Map<string, Set<string>> = new Map();
+  const localStorageProp: Map<string, Set<string>> = new Map();
  traversalComponentProps(node, properties, regulars, states, links, props, storageProps,
-    storageLinks, provides, consumes, objectLinks);
+    storageLinks, provides, consumes, objectLinks, localStorageLink, localStorageProp);
  return {
    properties, regulars, states, links, props, storageProps, storageLinks, provides,
-    consumes, objectLinks
+    consumes, objectLinks, localStorageLink, localStorageProp
  };
 }

 function traversalComponentProps(node: ts.StructDeclaration, properties: Set<string>,
  regulars: Set<string>, states: Set<string>, links: Set<string>, props: Set<string>,
  storageProps: Set<string>, storageLinks: Set<string>, provides: Set<string>,
-  consumes: Set<string>, objectLinks: Set<string>): void {
+  consumes: Set<string>, objectLinks: Set<string>,
+  localStorageLink: Map<string, Set<string>>, localStorageProp: Map<string, Set<string>>): void {
  let isStatic: boolean = true;
  if (node.members) {
    const currentMethodCollection: Set<string> = new Set();
@@ -659,8 +690,8 @@ function traversalComponentProps(node: ts.StructDeclaration, properties: Set<str
            const decoratorName: string = item.decorators[i].getText().replace(/\(.*\)$/, '').trim();
            if (INNER_COMPONENT_MEMBER_DECORATORS.has(decoratorName)) {
              dollarCollection.add('$' + propertyName);
-              collectionStates(decoratorName, propertyName, states, links, props, storageProps,
-                storageLinks, provides, consumes, objectLinks);
+              collectionStates(item.decorators[i], decoratorName, propertyName, states, links, props, storageProps,
+                storageLinks, provides, consumes, objectLinks, localStorageLink, localStorageProp);
            }
          }
        }
@@ -674,9 +705,10 @@ function traversalComponentProps(node: ts.StructDeclaration, properties: Set<str
  isStaticViewCollection.set(node.name.getText(), isStatic);
 }

-function collectionStates(decorator: string, name: string, states: Set<string>, links: Set<string>,
-  props: Set<string>, storageProps: Set<string>, storageLinks: Set<string>, provides: Set<string>,
-  consumes: Set<string>, objectLinks: Set<string>): void {
+function collectionStates(node: ts.Decorator, decorator: string, name: string,
+  states: Set<string>, links: Set<string>, props: Set<string>, storageProps: Set<string>,
+  storageLinks: Set<string>, provides: Set<string>, consumes: Set<string>, objectLinks: Set<string>,
+  localStorageLink: Map<string, Set<string>>, localStorageProp: Map<string, Set<string>>): void {
  switch (decorator) {
    case COMPONENT_STATE_DECORATOR:
      states.add(name);
@@ -702,6 +734,22 @@ function collectionStates(decorator: string, name: string, states: Set<string>,
    case COMPONENT_OBJECT_LINK_DECORATOR:
      objectLinks.add(name);
      break;
+    case COMPONENT_LOCAL_STORAGE_LINK_DECORATOR :
+      collectionlocalStorageParam(node, name, localStorageLink);
+      break;
+    case COMPONENT_LOCAL_STORAGE_PROP_DECORATOR:
+      collectionlocalStorageParam(node, name, localStorageProp);
+      break;
+    }
+  }
+  
+function collectionlocalStorageParam(node: ts.Decorator, name: string,
+  localStorage: Map<string, Set<string>>): void {
+  const localStorageParam: Set<string> = new Set();
+  if (node && ts.isCallExpression(node.expression) && node.expression.arguments &&
+    node.expression.arguments.length && ts.isStringLiteral(node.expression.arguments[0])) {
+    localStorage.set(name, localStorageParam.add(
+      node.expression.arguments[0].getText().replace(/\"|'/g, '')));
  }
 }

@@ -804,5 +852,6 @@ function validateAllowListModule(moduleType: string, systemKey: string): boolean

 export function resetComponentCollection() {
  componentCollection.entryComponent = null;
+  componentCollection.entryComponentPos = null;
  componentCollection.previewComponent = null;
 }
@@ -0,0 +1,94 @@
+/*
+ * Copyright (c) 2021 Huawei Device Co., Ltd.
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+exports.source = `
+let storage = LocalStorage.GetShared();
+
+class ClassA {
+    public id: number = 1;
+    public type: number = 2;
+    public a: string = "aaa";
+    constructor(a: string){
+        this.a = a;
+    }
+}
+
+@Entry(storage)
+@Component
+struct LocalStorageComponent {
+    @LocalStorageLink("storageSimpleProp") simpleVarName: number = 0;
+    @LocalStorageProp("storageObjectProp") objectName: ClassA = new ClassA("x");
+    build() {
+        Column() {
+            Text(this.objectName.a)
+                .onClick(()=>{
+                    this.simpleVarName +=1;
+                    this.objectName.a = this.objectName.a === 'x' ? 'yex' : 'no';
+                })
+        }
+        .height(500)
+    }
+}
+`
+exports.expectResult =
+`let storage = LocalStorage.GetShared();
+class ClassA {
+    constructor(a) {
+        this.id = 1;
+        this.type = 2;
+        this.a = "aaa";
+        this.a = a;
+    }
+}
+class LocalStorageComponent extends View {
+    constructor(compilerAssignedUniqueChildId, parent, params, localStorage) {
+        super(compilerAssignedUniqueChildId, parent, localStorage);
+        this.__simpleVarName = this.localStorage_.setAndLink("storageSimpleProp", 0, this, "simpleVarName");
+        this.__objectName = this.localStorage_.setAndProp("storageObjectProp", new ClassA("x"), this, "objectName");
+        this.updateWithValueParams(params);
+    }
+    updateWithValueParams(params) {
+    }
+    aboutToBeDeleted() {
+        this.__simpleVarName.aboutToBeDeleted();
+        this.__objectName.aboutToBeDeleted();
+        SubscriberManager.Get().delete(this.id());
+    }
+    get simpleVarName() {
+        return this.__simpleVarName.get();
+    }
+    set simpleVarName(newValue) {
+        this.__simpleVarName.set(newValue);
+    }
+    get objectName() {
+        return this.__objectName.get();
+    }
+    set objectName(newValue) {
+        this.__objectName.set(newValue);
+    }
+    render() {
+        Column.create();
+        Column.height(500);
+        Text.create(this.objectName.a);
+        Text.onClick(() => {
+            this.simpleVarName += 1;
+            this.objectName.a = this.objectName.a === 'x' ? 'yex' : 'no';
+        });
+        Text.pop();
+        Column.pop();
+    }
+}
+loadDocument(new LocalStorageComponent("1", undefined, {}, storage));
+`