Communication between parent and child components is implemented through props in react

Article directory 1. Parent component passes value to child component 1. Functional components pass values through props: 2. Class components pass values through props: 3. An elegant way to pass multiple values at once 2. Subcomponent passes value to parent component 1. In function component 2. In class component 3. propTypes limits props 1. Parent […]

OpenTiny Vue 3.11.0 released: adding 4 new components such as rich text and ColorPicker, ushering in an explosion of contributors!

Hello, my name is Kagol. I am very happy to announce to you that on October 24, 2023, OpenTiny Vue released v3.11.0. Every time a major version of OpenTiny is released, it will bring you some practical new features. On 8.14, we released version v3.10.0, which added 4 new components. The component Demo supports switching […]

Controlled components and uncontrolled components in React

Gathering sand into a tower, making a little progress every day ? Column introduction Front-end Getting Started Tour: Exploring the Wonderful World of Web Development Welcome to the Front-End Getting Started Tour! If you are interested, you can subscribe to this column! This column is tailor-made for those who are interested in web development and […]

Initial understanding of Web Components and implementing a button

Table of Contents 1.Basic concepts of Web Components 1.1 Three scenes 1.2 What is 2. Use Custom Elements to implement a button 2.1 Concept introduction 2.1.1 Shadow DOM 2.1.2 Element.attachShadow() 2.1.3 Basic steps for using Shadow DOM in components 2.1.4 attributeChangedCallback 2.1.5 get observedAttributes 2.1.6 dispatchEvent() 2.1.7 CustomEvent 2.2 Practice brings true knowledge 2.2.1 Initial […]

Functional components and class components in react

Article directory 1. Function components 1. Define function components 2. Functional components do not have their own state 2. Class components 1. Define class components 2. State in the class and how to update it 3. Rendering process of react update status 4. Event binding this points to the problem 1. Function component 1. Define […]

Advanced concepts in Vue.js: An in-depth look at rendering functions and rendering contentless components

Article directory Preface Render Functions Example scenes to be used Renderless Components Example scenes to be used Summarize ?Creator: Full stack trendsetter Personal homepage: The personal homepage of the full-stack trend-setter ? Personal community, you are welcome to join: a personal community for full-stack trendsetters Column address: vue2 advanced Foreword Render Functions and Renderless Components […]

Custom paging and combined search components in django

Table of Contents 1. Pagination component 2. Combined search components 1. Paging component example “”” v1 version In the view function: def customer_list(request): # All data queryset = models.Customer.objects.filter(active=1).select_related(‘level’) pager = Pagination(request, queryset) context = { “queryset”: queryset[pager.start:pager.end], “pager_string”: obj.html() } return render(request, ‘customer_list.html’, context) On the page: {% for row in queryset %} {<!– […]

Vue3 (2) life cycle, custom hooks, combined api, new components, vue3 changes, etc.

Table of Contents (1) Vue3 life cycle (2) Custom hook (3) toRef and toRefs 1.toRef 2.toRefs (4) Other combined APIs 1.shallowRef and shallowReactive 2.readonly and shallowReadonly 3.toRaw and markRaw (1)toRaw (2)markRaw: 4.customRef 5.provide and inject 6. Judgment of responsive data (5) Advantages of combined API (6) New components of vue3 1.Fragment component 2.Teleport component 3.Suspense […]

Form and ModelForm components in django

Table of Contents 1. Form component 1. Form function 1. Generate HTML tags 2. Carry data, display the default value (initial), and display the default value on the editing page. 3. Data verification, verify the data format submitted by the user 2. Form verification process 3. Type of form field 1. forms.ChoiceField() 2. forms.CharField() 4. […]

Ant-Design-Pro-V5: QueryFilter advanced filtering component, Table and Pagination components are combined to implement query.

Requirements: Select different types according to classification conditions, and the table calls different interfaces to display different data. Code: import React, {<!– –> useRef, useState, Fragment, useEffect } from ‘react’; import {<!– –> getNoticeInfo, getBannerList, delNotice } from ‘./service’; import {<!– –> getCodeSelecBytybe } from ‘@/services/globalServices’; import {<!– –> ProFormSelect, QueryFilter, PageContainer, ProFormText, ProTable, } […]