Injecting properties into Supabase filtering - VUE3 and Supabase integration

Attempting to pass a prop to the .like filter in a Supabase function. Since .like requires % in the value, I'm unsure how to pass the prop through. See the code snippet below:

const fetchData = async () => {
 const { data, error } = await supabase
 .from('sneaker')
 .select()
 .eq('brand', props.model?.brand)
 .like('name', '%Yeezy%')
 filteredList1.value = data
 console.log(data)
}

I would prefer to use props.model?.name instead of '%Yeezy%'. I have attempted to include the prop as indicated but it does not work. Any assistance would be greatly appreciated.

Answer №1

Have you attempted to combine the string together?

.like('name', `%${props.model?.name}%`)

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Delete the click event listener that was previously assigned by a different script

After extensive investigation using the Chrome developer tools, I have identified a click event listener that needs to be removed: https://i.sstatic.net/dnB3Q.png I successfully removed the listener using the developer tools. Further analysis revealed th ...

jQuerry's on method fails to respond to newly added elements through the clone() function

I always thought that jquery's on() function would handle events for dynamically added elements in the DOM, such as those added via ajax or cloning. However, I'm finding that it only works for elements already attached to the dom at page load. Cl ...

Working with MongoDB: Exploring ways to perform set operations on document collections

Can MongoDB perform the following query? select id, title from posts union all select id, name from programs sort by title asc; I am looking to combine and sort documents from two different collections as one. Any assistance would be appreciated. Additi ...

Encountering an issue with WebDriver in the realm of JavaScript

I am struggling to use JavaScript to locate specific controls and send values to them. One example is changing the text in a textbox with the ID "ID" to "123456". Below is the code I tried: ((IJavaScriptExecutor)driver).ExecuteScript("document.getElement ...

Why does my React.js application still display outdated data from my Express server even after refreshing the webpage?

I have been working on a website using React.js and Express.js, following an online example to set up the basic code. I encountered an issue where the frontend did not update when I made a minor change to the array sent by Express.js. Express - users.js f ...

Convert your AS3 code to JavaScript with our specialized compilers

Recently, I came across the AS3 to JS compiler known as Jangaroo. It caught my attention because it seems like a valuable tool that aligns well with my preferences in AS3. Are there any similar compilers out there? Is there another programming language ...

Adding a property during runtime to an object does not display in the current "this" context

Can anyone explain why the dynamic property added using Object.defineProperty does not show up when printing 'this' on the console? Here is a Decorator example. It seems to be working fine, but the success and error properties do not appear in & ...

Have you attempted to configure a JSON file to facilitate language translations?

I need some guidance on structuring my data.json file efficiently. Currently, it is set up as shown in the example below. The goal is to have a drop-down menu where users can select a language and then display 50 different pages with specific content. I wa ...

How can I retrieve button clicks with JQuery DataTables mRender?

I am currently using the following ajax call: $('#stlmtddel').click(function(event) { var customerid = "<%=customerid%>"; var appointofcaid = "<%=appointofcaid%>"; var kindcontrolid = "<%=kindcontrolid% ...

Retrieving the response value in AngularJS with $resource

I'm trying to retrieve the response of a request using $resource in AngularJS. Here is an example implementation: angular.module('app').factory('AuthResource', ['$resource', function($resource) { return { isA ...

sequenced pauses within a sequence of interconnected methods in a class

scenario: There are two javascript classes stored in separate files, each utilizing a different external service and being called within an express.js router. Refer to the "problematic code" section below: route routes.post('/aws', upload.sing ...

Preventing jQuery Validate Plugin from Validating on Blur Events for a Custom Feature

How can I prevent jQuery validate from validating the form on blur events? I have a form with three pairs of start/end dates, each using DatePicker. Each pair should validate if the other field is filled because both are required for form submission. Howe ...

What are some tips for incorporating vue.js into a basic web application?

I've been trying to incorporate vue.js into my web application, but for some reason, it's not loading and the HTML is not firing in the browser. Please take a look at the code snippet below: <!DOCTYPE html> <html> < ...

What is the best way to mock a Typescript interface or type definition?

In my current project, I am working with Typescript on an AngularJS 1.X application. I make use of various Javascript libraries for different functionalities. While unit testing my code, I am interested in stubbing some dependencies using the Typings (inte ...

Issue with PHP alert box functionality not functioning as expected

I am currently working on my contact-form-handler.php file. I have successfully set up my form to send emails and redirect to the main page after submission. However, I am facing an issue with displaying an alert message in PHP once the submit button is cl ...

Is `h` equal to `createVNode` function?

Both h and createVNode are exposed from vue. The documentation on this page seems to imply that they are interchangeable: The h() function is a utility to create VNodes. It could perhaps more accurately be named createVNode(). However, replacing h with ...

What is the best way to package a UI library in a monorepo?

After dedicating a significant amount of time to unraveling this issue, I find myself at a standstill. Incorporating Turbo as a monorepo, I utilized the create-turbo@latest command, outlined in detail here. While the default ui/package functions properly ...

Verify a document located on another server

My objective is to prompt the user to download a file generated by my script and upload it onto their server (this functionality has been successfully implemented). The purpose of this task is to confirm that the user can indeed upload files to the website ...

Should we consider the implementation of private methods in Javascript to be beneficial?

During a conversation with another developer, the topic of hacking into JavaScript private functions arose and whether it is a viable option. Two alternatives were discussed: Using a constructor and prototype containing all functions, where non-API meth ...

Tips for altering the appearance of the material-ui slider thumb design when it is in a disabled state

Through the use of withStyles, I have successfully customized the style of the Slider: const CustomSlider = withStyles(theme => ({ disabled: { color: theme.palette.primary.main }, thumb: { height: 24, width: 24, }, }))(Slider); How ...