Make a Mini Program page of the questionnaire. It is required that the problem can be created dynamically and then the value can be taken.

clipboard.png
as shown in the above figure, it is required to create a question dynamically and then take a value. But like a two-way slider. Two variable assignments are required. If there are three and four sliders at once. How can I dynamically create the value of a variable? There is no train of thought at the moment.

Vue.js javascript html5
Jun.17,2022

you can refer to
title: title
name: the field name of the topic
type: topic type, drop-down selection, scope selection or direct text filling. When circular rendering, select different components
data: topic data according to this judgment. For example, range selection requires a start and end, and drop-down selection requires data to choose
value: topic value. The value selected or filled by the user may be a string or an array of ranges.

topic data list 

[
    {
        title: ''
        name: 'area',
        type: 'area',
        data: [0,300],
        value: []
    },
    {
        title: '',
        name: 'city',
        type: 'select',
        data: [
            {
                label: '',
                value: '110000'
            }
        ]
        value: ''
    },
    {
        title: '',
        name: 'position'
        type: 'input',
        value: ''
    }
]

render data 

<ul>
    <li v-for="(item, index) in list">
        <div>{{index}}.{{ item.title}}</div>
        <!--  -->
        <template v-if="item.type === 'input'">
            <input v-model="item.value" />
        </template>
    </li>
</ul>

get the selected data 

let ajaxSendData = {}//ajax
//
//{
//    area: [0, 100],
//    city: '110000',
//    position: ''
//}
for(let i = 0; i < list.length; iPP) {
    ajaxSendData[list[i].name] = list[i].value
}

Previous: How does the mobile swiper.js unblock touchmove events on the iScroll element?

Next: When git branch-r, I found that there are no branches in the remote.

css mysql arrays josn react html typescript webpack npm sass R objective-c .net sql-server jquery python-3.x angularjs django angular excel regex iphone ajax linux xml pandas vba spring database wordpress string wpf xcode windows bash postgresql oracle multithreading eclipse list firebase algorithm macos forms image scala visual-studio azure bootstrap spring-boot react-native python-2.7 docker performance function winforms matlab powershell apache dataframe api sqlite numpy rest shell selenium flutter dart maven loops qt swing android-studio csv express file class tensorflow sorting codeigniter perl
© 2021 CodesHelper
Advertising Contact us About us
Menu