Collapse

Basic Usage：

ECMAScript 6 Introduction

ECMAScript 6.0 (hereinafter referred to as ES6) is the next generation standard of JavaScript language, which was officially released in June 2015. Its goal is to make JavaScript language can be used to write complex large-scale applications and become an enterprise-level development language.

Syntax of Module

The design idea of the ES6 module is to make it as static as possible, so that the dependency of the module and the input and output variables can be determined at compile time. CommonJS and AMD modules can only be determined at runtime. For example, the CommonJS module is an object. You must find the object properties when entering.

Deconstruction assignment of variables

Simplify the process: design simple and intuitive operation process;

ES6 allows extracting values from arrays and objects and assigning values to variables according to certain patterns, which is called deconstruction.

Let and const commands

ES6 adds the let command to declare variables. Its usage is similar to var, but the declared variables are only valid in the code block where the let command is located.

Const declares a read-only constant. Once declared, the value of the constant cannot be changed.

<lee-collapse v-model="expname" @change="handleChange">
    <lee-collapse-item title="ECMAScript 6 Introduction" name="1">
    <div>ECMAScript 6.0 (hereinafter referred to as ES6) is the next generation standard of JavaScript language, which was officially released in June 2015. Its goal is to make JavaScript language can be used to write complex large-scale applications and become an enterprise-level development language.</div>
    </lee-collapse-item>
    <lee-collapse-item title="Syntax of Module" name="2">
    <div>The design idea of the ES6 module is to make it as static as possible, so that the dependency of the module and the input and output variables can be determined at compile time. CommonJS and AMD modules can only be determined at runtime. For example, the CommonJS module is an object. You must find the object properties when entering.</div>
    </lee-collapse-item>
    <lee-collapse-item title="Deconstruction assignment of variables" name="3">
    <div>Simplify the process: design simple and intuitive operation process;</div>
    <div>ES6 allows extracting values from arrays and objects and assigning values to variables according to certain patterns, which is called deconstruction.</div>
    </lee-collapse-item>
    <lee-collapse-item title="Let and const commands" name="4">
    <div>ES6 adds the let command to declare variables. Its usage is similar to var, but the declared variables are only valid in the code block where the let command is located.</div>
    <div>Const declares a read-only constant. Once declared, the value of the constant cannot be changed.</div>
    </lee-collapse-item>
</lee-collapse>

<script>
  export default {
    data() {
      return {
        expname: ['1']
      };
    },
    methods: {
      handleChange(val) {
        console.log(val);
      }
    }
  }
</script>

显示代码

Accordion：

ECMAScript 6 Introduction

ECMAScript 6.0 (hereinafter referred to as ES6) is the next generation standard of JavaScript language, which was officially released in June 2015. Its goal is to make JavaScript language can be used to write complex large-scale applications and become an enterprise-level development language.

Syntax of Module

The design idea of the ES6 module is to make it as static as possible, so that the dependency of the module and the input and output variables can be determined at compile time. CommonJS and AMD modules can only be determined at runtime. For example, the CommonJS module is an object. You must find the object properties when entering.

Deconstruction assignment of variables

Simplify the process: design simple and intuitive operation process;

ES6 allows extracting values from arrays and objects and assigning values to variables according to certain patterns, which is called deconstruction.

Let and const commands

ES6 adds the let command to declare variables. Its usage is similar to var, but the declared variables are only valid in the code block where the let command is located.

Const declares a read-only constant. Once declared, the value of the constant cannot be changed.

<lee-collapse v-model="expname" @change="handleChange" accordion>
   <lee-collapse-item title="ECMAScript 6 Introduction" name="1">
   <div>ECMAScript 6.0 (hereinafter referred to as ES6) is the next generation standard of JavaScript language, which was officially released in June 2015. Its goal is to make JavaScript language can be used to write complex large-scale applications and become an enterprise-level development language.</div>
   </lee-collapse-item>
   <lee-collapse-item title="Syntax of Module" name="2">
   <div>The design idea of the ES6 module is to make it as static as possible, so that the dependency of the module and the input and output variables can be determined at compile time. CommonJS and AMD modules can only be determined at runtime. For example, the CommonJS module is an object. You must find the object properties when entering.</div>
   </lee-collapse-item>
   <lee-collapse-item title="Deconstruction assignment of variables" name="3">
   <div>Simplify the process: design simple and intuitive operation process;</div>
   <div>ES6 allows extracting values from arrays and objects and assigning values to variables according to certain patterns, which is called deconstruction.</div>
   </lee-collapse-item>
   <lee-collapse-item title="Let and const commands" name="4">
   <div>ES6 adds the let command to declare variables. Its usage is similar to var, but the declared variables are only valid in the code block where the let command is located.</div>
   <div>Const declares a read-only constant. Once declared, the value of the constant cannot be changed.</div>
   </lee-collapse-item>  
</lee-collapse>

<script>
  export default {
    data() {
      return {
        expname: '1'
      };
    },
    methods: {
      handleChange(val) {
        console.log(val);
      }
    }
  }
</script>

显示代码

Attribute

Parameter	Description	Type	Optional Value	Default Value
v-model	Expanded items	String,Array	Name value of the item	-
accordion	Accordion	Boolean	-	false

Event

Event name	Description	Callback parameter
change	Change event	the array collection of Expand items