getElementById(id: string)

Requires:
@ray-js/ray≥0.5.10

Description

Get a page node

Parameters

ParameterTypeRequiredDescription
idstringYesThe value of the node's id attribute

Return Value

Type: Promise<NodesRef>
Node reference object; returns null if the node does not exist

Referenced Types

interfaceNodesRef
PropertyTypeDescription
Get node layout position (left, right, top, bottom, width, height)
Get node scroll position (scrollLeft, scrollTop)
Get specified fields of the node

Examples

Basic usage

import React from 'react';
import { View, Button, Text, getElementById } from '@ray-js/ray';

export default function Demo() {
  const handleGetElement = async () => {
    const element = await getElementById('targetView');
    console.log('Node reference:', element);
  };

  return (
    <View style={{ padding: 20 }}>
      <View
        id="targetView"
        style={{
          height: 100,
          backgroundColor: '#1890ff',
          display: 'flex',
          alignItems: 'center',
          justifyContent: 'center',
        }}
      >
        <Text style={{ color: '#fff' }}>Target node</Text>
      </View>
      <Button style={{ marginTop: 10 }} onClick={handleGetElement}>
        Get node reference
      </Button>
    </View>
  );
}