🧩 Plasmo Developers•3y ago

Yes you can pass a variable from the

Yes, you can pass a variable from the getInlineAnchorList function to the CSUI component itself. In your case, if you want to grab the data-x attribute on the results item and access it in the CSUI code, you can modify the getInlineAnchorList function to include the desired data in the anchor object that is passed to the CSUI component. Here's an example of how you can achieve this: 1. Modify the getInlineAnchorList function to include the data-x attribute in the anchor object:

import type { PlasmoGetInlineAnchorList } from "plasmo"

export const getInlineAnchorList: PlasmoGetInlineAnchorList = async () => {
  const anchors = document.querySelectorAll("a")
  const anchorList = []

  for (const anchor of anchors) {
    const dataX = anchor.getAttribute("data-x")
    anchorList.push({ element: anchor, dataX })
  }

  return anchorList
}

import type { PlasmoGetInlineAnchorList } from "plasmo"

export const getInlineAnchorList: PlasmoGetInlineAnchorList = async () => {
  const anchors = document.querySelectorAll("a")
  const anchorList = []

  for (const anchor of anchors) {
    const dataX = anchor.getAttribute("data-x")
    anchorList.push({ element: anchor, dataX })
  }

  return anchorList
}

2. In your CSUI component, access the dataX attribute from the anchor object:

import React from "react"

interface CSUIProps {
  anchor: {
    element: HTMLAnchorElement
    dataX: string | null
  }
}

const CSUIComponent: React.FC<CSUIProps> = ({ anchor }) => {
  const { dataX } = anchor

  // Use the dataX attribute in your component logic
  // ...

  return (
    // JSX for your CSUI component
    <div>
      <p>Data X: {dataX}</p>
    </div>
  )
}

export default CSUIComponent

import React from "react"

interface CSUIProps {
  anchor: {
    element: HTMLAnchorElement
    dataX: string | null
  }
}

const CSUIComponent: React.FC<CSUIProps> = ({ anchor }) => {
  const { dataX } = anchor

  // Use the dataX attribute in your component logic
  // ...

  return (
    // JSX for your CSUI component
    <div>
      <p>Data X: {dataX}</p>
    </div>
  )
}

export default CSUIComponent

By including the dataX attribute in the anchor object, you can access it in the CSUI component and use it in your component logic as needed.

2 Replies

Joshua Perk•3y ago

!question how do I access the CSUIProps anchor object in Vue?

PallasOP•3y ago

Something went wrong.

Gaming

Programming

Yes you can pass a variable from the

Did you find this page helpful?