React 获取浏览器元素的属性

最新推荐文章于 2023-12-13 15:45:01 发布

杨平祥 PMO

最新推荐文章于 2023-12-13 15:45:01 发布

阅读量368

点赞数 1

分类专栏： React 文章标签： react.js

本文链接：https://blog.csdn.net/fenboo9416/article/details/120607142

版权

React 专栏收录该内容

7 篇文章 0 订阅

订阅专栏

React在三大前端编程中，以其出色的响应技术而受人欢迎，如何双击元素，然后获得该元素的相关属性值，在网上查了许多写法，均达不到满意的效果，直到找出如下的办法，圆满解决。

const handDoubleClick = (e) => {

    alert('x='+e.currentTarget.getAttr('x')+', y='+e.currentTarget.getAttr('y'));

  };

  return (
    <Stage width={600} height={400} >
      <Layer>
        <Text text="Try to drag a star" />
        {stars.map((star) => (
          <Star
            key={star.id}
            id={star.id}
            x={star.x}
            y={star.y}
            numPoints={5}
            innerRadius={20}
            outerRadius={40}
            fill="#89b717"
            opacity={0.8}
            draggable
            rotation={star.rotation}
            shadowColor="black"
            shadowBlur={10}
            shadowOpacity={0.6}
            shadowOffsetX={star.isDragging ? 10 : 5}
            shadowOffsetY={star.isDragging ? 10 : 5}
            scaleX={star.isDragging ? 1.2 : 1}
            scaleY={star.isDragging ? 1.2 : 1}
            onDragStart={handleDragStart}
            onDragEnd={handleDragEnd}
            onDblClick={handDoubleClick}
          />
        ))}
      </Layer>
    </Stage>
  );