JS and Vue notes

Source: Internet
Author: User
Tags string to json

1.JS gets all the sibling elements. Function siblings (Elm) {var a = [];var p = elm.parentnode.children;for (var i =0,pl= p.length;i<pl;i++) {if (P[i]!== Elm ) A.push (P[i]);} return A;} 2. To determine whether an array contains multiple values, you need to make two judgments, that is, first determine if there is no first value, then loop, and then determine whether there is a second value. 3.http://idangero.us/swiper/demos/#.wungdv--uan Touch drag, similar to carousel 4. Judging the picture's width according to the link of the picturevar img = new Image (), img.onload = function () {alert (this.width); alert (this.height); this.onload = null;}; img.src = URL; After the picture is loaded, get the actual width and height var _test = document.getElementById ("Test"), Test.onload = function () {imgsize.call (_test);}  function imgsize () {var imgobj = new Image ();  IMGOBJ.SRC = THIS.SRC; Alert (imgobj.width + "\ n" + imgobj.height);} 5.h5 Video does not play automatically. Voice words can be set at the end of the compatibility and then automatically play, such as H5 background music can be played automatically. A H5. To add multiple audio, you need to define the DOM in advance, then compatible, and change the SRC attribute of the DOM according to different circumstances. 6. Operation the same element to add the same event needs to be cleared immediately with immediate use, otherwise it will affect the subsequent operation. 7.canvas element js Dynamic generation will have a lot of problems, need to write directly in the HTML data in 8.vue holds elements that can be directly retrieved, methods the method of storing elements, including click events, and so on. 9.var obj = Str.parsejson ();//Convert JSON string to JSON object the method after 10.renturn is actually the callback function of the current function 11. The effect of writing a letter JS implementation https://github.com/powhd/native 12. Chat-like content every time you add a newly added element to the bottom of the display$ (' #el '). ScrollTop (10000000) 13. Problem-Solving considerations: Logic issues, asynchronous issues 14. File drag and drop upload http://wxb.github.io/dropzonejs.com.zh-CN/dropzonezh-CN/ 15. Variables should be composed of words, because JS has reserved words 16. Parent component takes sub-component data: add a ref attribute to the subcomponent and add this to the method that the parent component needs to use this data. $refs. SQL 17. Sub-components take the parent component's data: Use this directly $parent to get all the properties of the parent component 18. You need to use Vuex or props to pass the value. 19. Event BroadcastSubcomponents use the parent component's method to require a subassembly to define a method and then point to the parent component, and then the parent component's module name is added to this method. a list in 20.vue has a click event also has the mouse moves in the move out event, Then in the definition of a default value, and then add the Ishover style in the CSS, is the mouse click on the future style, and with the mouse moved out of the CSS does not conflict. The principle is that three mesh determines the value of the clicked Element Actived, if 1,class is added Ishover 21. Image upload Preview clip avatar function http://www.17sucai.com/preview/1/2017-03-16/ima_up/index.html 22. One-dimensional array to two-dimensional arrayvar data=temarray;var result=[];for (var i=0,len=data.length;i<len;i+=5) {Result.push (Data.slice (i,i+5));} 23. Cancel the Chrome browser user input box with a yellowish background:Input:-webkit-autofill,input:-webkit-autofill:hover, Input:-webkit-autofill:focus, input:-webkit-autofill:active {-webkit-transition-delay:99999s;-webkit-transition:color 99999s ease-out, Background-color 99999s ease-out;} http://blog.csdn.net/zhangdongxu999/article/details/73741390 24.vue: The son takes the father prop father take son emit on brothers words Vuex 25.vue Registers a global event, that is, a component that is not a parent-child relationship can also invoke a method:       1. Registration method on the component where the value resides 2. Call this method where the value needs to be changed after the event is triggered   3. Destroy and Trigger in the same component The changes of the internal properties of the Watch Monitor module in 26.vue can be used to monitor the changes of the components ' internal properties every time the event is triggered . 27.vuex defining how to use global variables      1. First define the property name null    2. Defining Set_name in Mutations 3. Define SetName in Actions 4. Defined in import, methods of the component to be used 28. Let the text inside an element always be centered vertically up and down in this element 29. The route does not change, only change the parameters of the case may not alter the data content, the solution is to listen to the parameters returned by the route, and then re-request data. http://blog.csdn.net/peng_guan/article/details/59702699 30.QQ third-party login 31. Click Add Class to remove the sibling element class 32.js file value between each other For Loop in 33.vue: Key will be reported to the key after the data change for the for loop, the solution is to choose not to add: key. 34.vue Routing Defining routing Addresses set up Routes Jump Routing via Router-view <router-view></router-view> 35.img Default Picture 36.vue Component El-dailg pop-up box set size to set the width 37.vue the same way by different parameters monitoring http://blog.csdn.net/peng_guan/article/details/59702699 38. Handling the request cache issue can be added timestamp after the request address + "? t=" + New Date (). GetTime () 39. The input box loses focus event and the button's Click event Conflict: Button Click event can be used Mousudown, and then disable the default behavior. button to use the normal button, the component button cannot be used. 40. Display time, time can be dynamically increased 41. Set child elements to be centered around the parent element, the parent element is set relative, and the child element is set Absolute,top,left50%;transform:translate ( -50%);

JS and Vue notes

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.